@Andres Pena
Register your site with facebook and obtain your appId for use in the iFrame then code something like this:
iFrame HTML code:
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
<script>
// Load the SDK asynchronously
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = ‘https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v3.2’;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));
// initialize and setup facebook js sdk
window.fbAsyncInit = function() {
FB.init({
appId : 'XXXXXXXXXXXXXXXX',
xfbml : true,
version : 'v3.2'
});
FB.getLoginStatus(function(response) {
//console.log(response);
if (response.status === 'connected') {
console.log("connected with facebook for status");
} else if (response.status === 'not_authorized') {
console.log("facebook connection not authorized for status");
} else {
console.log("you are not logged into facebook for status");
}
});
};
// login with facebook with extra permissions
function login() {
FB.login(function(response) {
//console.log(response);
if (response.status === 'connected') {
//get user info and post to page code
FB.api('/me', 'GET', {fields: 'first_name,last_name,name,id,email'}, function(response) {
//console.log(response);
let userId = response.id;
let fullName = response.name;
let firstName = response.first_name;
let lastName = response.last_name;
let userEmail = response.email;
window.parent.postMessage({userId: (userId),fullName: (fullName), firstName: (firstName), lastName: (lastName),userEmail: (userEmail)}, "*");
//now we log the user back out of facebook on our site only as we have already posted the user info to the page code
FB.logout(function(response) {
// user is now logged out
});
});
}
else if (response.status === 'not_authorized') {
console.log("facebook connection not authorized for login");
}
else {
console.log("you are not logged into facebook for login");
}
}, {scope: 'email'});
}
</script>
Sign in with Facebook
Javascript code for front end:
import wixUsers from ‘wix-users’;
$w.onReady( function () {
$w(“#facebookAuthHTML”).onMessage((results) => {
let facebookAccoutInfo = results.data;
//console.log(facebookAccoutInfo);
//string values for each item
let fUserId = results.data.userId;
let firstName = results.data.firstName;
let lastName = results.data.lastName;
let fullName = results.data.fullName;
let unformattedUserEmail = results.data.userEmail
console.log(fUserId);
console.log(firstName);
console.log(lastName);
console.log(fullName);
console.log(unformattedUserEmail);
//proceed to register or log in user as appropriate
})
})
