Does Parse.FacebookUtils.logIn only enable Facebook login via popup?
I am trying to use the parse.com Facebook SDK so that my users can login to my site using the Fb login button.
I have this lovely desktop for desktop browsers and Safari, but there is a known issue with ios Chrome that creates the discussed bug here .
My research has led me to conclude that the class Parse.FacebookUtils.logIn
that calls the Facebook popup opens correctly?
If so, is it not possible to open this as a page and not pop up? which would avoid the above error.
I created a workaround that works for standard Facebook login, but doesn't work for Parse. Not sure if this can be used? Information for this job appeared here .
I also saw the answer from Rahul here as a potential solution, but I'm not sure how to implement it
Any help would be greatly appreciated as I've been stuck on it for ages.
function getUserData() {
FB.api('/me', function(response) {
document.getElementById('response').innerHTML = 'Hello ' + response.name;
});
}
window.fbAsyncInit = function() {
//SDK loaded, initialize it
Parse.FacebookUtils.init({
appId : '12345',
xfbml : true,
version : 'v2.3'
});
//check user session and refresh it
var uri = encodeURI('http://mysite123.com/user_home.html');
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
//user is authorized
document.getElementById('loginBtn').style.display = 'none';
getUserData();
} else {
//user is not authorized
}
});
};
//load the JavaScript SDK
(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 = "//connect.facebook.net/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//add event listener to login button
document.getElementById('loginBtn').addEventListener('click', function() {
var ABSOLUTE_URI = "http://mysite123.com/user_home.html";
var FB_ID = "12345";
// Open your auth window containing FB auth page
// with forward URL to your Opened Window handler page (below)
var redirect_uri = "&redirect_uri=" + ABSOLUTE_URI;
var scope = "&scope=public_profile,email,user_friends";
var url = "https://www.facebook.com/dialog/oauth?client_id=" + FB_ID + redirect_uri + scope;
// notice the lack of other param in window.open
// for some reason the opener is set to null
// and the opened window can NOT reference it
// if params are passed. #Chrome iOS Bug
window.open(url);
function fbCompleteLogin(){
Parse.FacebookUtils.logIn(null, {
success: function(user) {
if (!user.existed()) {
alert("User signed up and logged in through Facebook!");
} else {
alert("User logged in through Facebook!");
}
},
error: function(user, error) {
alert("User cancelled the Facebook login or did not fully authorize.");
}
});
}
function requireLogin(callback){
FB.getLoginStatus(function(response) {
if (response.status != "connected"){
showLogin();
}else{
checkAuth(response.authResponse.accessToken, response.authResponse.userID, function(success){
// Check FB tokens against your API to make sure user is valid
});
}
});
}
}, false);
source to share
I got stuck on the same question and solved it. If you don't want to pop up in a new window, use OAuth to login to facebook.
You can use parse-facebook-user-session to get it done quickly. After that, just use the <a> hyperlink to link the login page. And perhaps you will run into error 209 Invalid session token . You just have to enable the Require Canceled Sessions option on the Parse.com panel settings page.
If you still have questions about how to get access_token users access, I wrote some posts on my blog and maybe this will help you (Sorry, posts were described in Chinese).
UPDATE:
I created a demo and GitHub , check it out.
source to share
If you want to manage the login process yourself, you need to bypass the Parse part. My advice is to login with Facebook using the FB api that you can customize.
After that, you will get an object from facebook containing some information like token, expireDate, ... This object can be passed to Parse.FacebookUtils.logIn methods to associate a Facebook account with parse.
Here is a snippet for cordova, there may be some changes.
$cordovaFacebook.getLoginStatus().then(function(rep){
console.log(JSON.stringify(rep));
var expDate = new Date(new Date().getTime() + rep.authResponse.expiresIn * 1000 ).toISOString();
var authData = {
id: String(rep.authResponse.userID),
access_token: rep.authResponse.accessToken,
expiration_date: expDate
}
return Parse.FacebookUtils.logIn(authData);
})
source to share