So, I have created your standard facebook test app. It has the javascript SDK loading block and the following code after it:
window.fbAsyncInit = function()
{
console.log('initiating FB');
FB.init({
appId: appID,
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
FB.Event.subscribe(
'auth.authResponseChange',
function(response)
{
console.log('authResponseChange', response);
if (response.status === 'connected')
{
console.log('logged in');
}
else
{
console.log('not logged in');
}
}
);
};
The problem: with my dev account, every console.log() is logged, as expected. With a different account not in any way related to the app it only logs 'initiating FB', and nothing after that, even though status: true. Why is this happening?
That's fine, since there's no change in the state.
The auth.authResponseChanged event is fired when the auth response has changed. The authResponse is part of the response object that's returned when querying the state of a person's authentication status. It contains the person's access token, when the token will expire and the person's user ID.
For an app user, when you run the app- status is changed to login since you have set status: true, so this event is triggered and you got logged in and come to the session.
But when you run the app for a not-logged-in/non-app user, this event wont trigger since the status is not changed. It was "not-logged-in" or "not-authorized" earlier and its the same now.
When you call facebook login for a not-logged-in user/non-app user, the status will change and you will see a your log as "logged in" or "not logged in".
Related
We are developing a website at www.bodecanada.com. One of the login methods we provide is facebook. We also try to keep track of whether the user is logged into facebook or not when refreshing the page or opening the site in a new tab. We do this by calling FB.getLoginStatus() (from the Facebook js sdk). However, we are finding that in a few cases--for example, when opening the site in a new tab in Safari--the response status that comes back from FB.getLoginStatus is 'unknown'. The Facebook SDK documentation says this about the 'unknown' status:
FB.getLoginStatus() allows you to determine if a user is logged in to
Facebook and has authenticated your app. There are three possible
states for a user:
The user is logged into Facebook and has authorized your application. (connected)
The user is logged into Facebook but has not authorized your application.(not_authorized)
The user is either not logged into Facebook or explicitly logged out of your application so it doesn't attempt to connect to Facebook
and thus, we don't know if they've authenticated your application or
not. (unknown)
We are dealing with #3 in this case. However, when I visit facebook, I find I am not logged out. But at the same time, I am not "explicitly logged out" (meaning FB.logout() is called) from my site. So why is it returning 'unknown'?
One solution I found on google says to add cookies: true to FB.init() in order to enable 3rd party cookies, so I did so:
FB.init({
appId : process.env.FB_APP_ID,
cookie : true,
xfbml : true,
version : 'v2.2'
});
But this doesn't change anything.
So why does FB.getLoginStatus() return 'unknown' for the response status when I open the site in a new tab?
Thanks.
I had the same issue when I closed and reopened the browser again. What I did is put the fb.login function if the status is unknown. But, emergent windows must be enabled in the browser:
function statusChangeCallback(response) {
if (response.status === 'connected') {
userId = response.authResponse.userID;
accessToken = response.authResponse.accessToken;
var userinfo = getUserInfo(userId);
} else if (response.status === 'unknown') {
FB.login(function(response) {
statusChangeCallback(response)
}, {scope: 'public_profile,email'});
}
}
I'm getting the same issue, also using "cookie: true". But.. if I put the call to FB.login into the "status === 'unknown'" block, I get a blocked FB oauth popup - that is an empty window. I know I'm logged into Facebook (it's in the next tab over), I just don't understand why FB.loginStatus always returns "unknown".
I'm creating a Facebook app for mobile devices. Such application is displayed within a mobile browser, unlike Facebook canvas pages which are held in an iframe.
I'm using a mix of JS and PHP SDK to authorize and authenticate a user. The user needs to be already logged into Facebook to use my app. If not, they need to log in with Facebook login button. As a bridge between JS and PHP SDKs I'm using FacebookJavaScriptLoginHelper.
Part of my Facebook.php library doing the job:
<?php
// Initialize the SDK
FacebookSession::setDefaultApplication($this->app_id, $this->app_secret);
// Create the login helper
$this->helper = new FacebookJavaScriptLoginHelper();
try {
$this->session = $this->helper->getSession();
} catch(FacebookRequestException $ex) {
// When Facebook returns an error
} catch(Exception $ex) {
// When validation fails or other local issues
}
if ($this->session) {
// User logged in
$this->session = new FacebookSession($this->session->getToken());
}
?>
Facebook JS init:
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId: '{my app id}',
status: true,
xfbml: true,
cookie: true
});
}
FB.getLoginStatus(function(response) {
console.dir(response);
});
</script>
The above code works fine but there's a specific case when it fails. Let's assume I have two tabs open in my browser: in the first tab I have my app open, in the second one - I'm logged into Facebook. Two scenarios can take place:
I log out of Facebook and refresh the tab with my app. The result is correct:
FacebookSession is NULL
response.status from FB.getLoginStatus is 'unknown'. The user is not
logged in.
I go to the second tab, log back into Facebook and refresh the first tab with my app. The result is incorrect, but only on the first refresh:
FacebookSession is still NULL, even if
response.status of FB.getLoginStatus is 'connected'
The reason behind this fail on first refresh seems to be obvious: In the moment of reloading the page PHP SDK is triggered before Facebook cookie is refreshed. However, it's never a problem when the user logs out - in this case, somehow FacebookSession is updated instantly, as expected.
How come it does not work the same when the user logs into Facebook?
Does this help?
Subsequent calls to FB.getLoginStatus will return data from this cached response. This can cause problems where the user has logged into (or out of) Facebook since the last full session lookup, or if the user has removed your application in their account settings.
To get around this, you call FB.getLoginStatus with the second parameter set to true to force a roundtrip to Facebook - effectively refreshing the cache of the response object.
FB.getLoginStatus(function(response) {
// this will be called when the roundtrip to Facebook has completed
}, true);
Source: https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus
Section: Roundtrips to Facebook's servers
Hey fellow Facebook developers,
I've read dozens of related questions and hopefully tried every related example on developers.facebook.com but I can't get this one to work:
A user has visited my website and authorized the permissions I request from him via
FB.login(callback, {
scope: 'publish_actions,user_actions:news,user_interests'
});
after calling
FB.init({
appId: 'xxx', // App ID
status: true, // check login status
cookie: true,
xfbml: true // parse XFBML
});
I can now successfully request an access token that is valid for some time and use that to query all kind of information about the user.
Without logging out anywhere (Facebook or my own website), if I now navigate to that page again (or just hit reload), I would expect to immediately be able to use
FB.getLoginStatus(callback)
and receive a response of connected. In my understanding, the user should not have to click anything anymore.
What I do get, though, is unknown. No matter in what browser and no matter whether I am using a real developer profile or a Facebook test user.
I also have subscribed to the events auth.authResponseChange and auth.statusChange but they only fire, if I explicitly call FB.login().
It says in the example in the Facebook SDK documentation that my FB.init() from above should already get the necessary information from Facebook on page load time and that the events should fire accordingly.
Since I tried so many examples already and really think I understand the documentation, I can't see where the error happens.
Is there anything I'm missing, anything I am misunderstanding or a timing problem I should be aware of?
On a side note, I have already tried more than the mentioned Facebook events, a forced status update through FB.getLoginStatus(callback, true), running the code step by step by entering it in the Javascript console of Chrome and more suggestions from SO and Facebook forums.
If you set the status: true, the FB.getLoginStatus response object will be cached by the SDK and subsequent calls to FB.getLoginStatus will return data from this cached response.
To get around this, you have to call FB.getLoginStatus with the second parameter set to true to force a roundtrip to Facebook - effectively refreshing the cache of the response object.
Example:
window.fbAsyncInit = function() {
FB.init({
appId : '',
status : true,
cookie : true,
xfbml : true,
});
FB.getLoginStatus( function(response) {
//console.log(response);
if (response.status === 'connected') {
var accessToken = response.authResponse.accessToken;
alert(accessToken);
} else if (response.status === 'not_authorized') {
//login function
} else {
//login function
}
}, true);
FB.Event.subscribe('auth.authResponseChange', function(response) {
//console.log('The status of the session changed to: '+response.status);
alert(response.status);
});
};
Documentation: https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/
As an additional information to Philip's accepted answer, I would like to mention that a cookie blocker was the actual reason the auto-login did not work.
Make sure to disable any plugins you have running before testing your code and assuming "real world" conditions.
I'm using Facebook Javascript SDK. For my app, I can have a user either login using Facebook, Twitter, or an account (email/password). I can get Facebook authentication to work. After successful Facebook authentication, I create a user session and the user proceeds to use the app. I have a logout button in the app that destroys the session and sends user back to the login page.
When the user lands back on login page, they are still connected to Facebook. I've tried calling FB.logout but the return function for getLoginStatus never fires. What am I doing wrong?
Here's my code:
window.fbAsyncInit = function()
{
FB.init({appId: 99999999, status: true, cookie: true, xfbml: true, oauth: true});
//LOGOUT FB USER
FB.getLoginStatus(function(response)
{
alert("status: " + response.status);
if (response.authResponse)
{
FB.logout();
alert('logged out');
}
}, true);
//SUBSCRIBE TO LOGIN EVENT
FB.Event.subscribe('auth.login', function(response)
{
if(response.authResponse)
{
FB.api('/me', function(response)
{
//at this point user has been authenticated so they can continue with app...
});
}
else
{
alert("Ooops, the Facebook authentication has failed. Please try again.");
}
});
};
(function(d){
var js, id = 'facebook-jssdk';
if (d.getElementById(id)){ return; }
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementById('fb-root').appendChild(js);
}(document));
What are the best practices around incorporating Facebook authentication into your app? How do you manage logging user out of your app without logging them out of facebook altogether?
Thanks for your time.
Sorry, I misunderstood your question.
The FB SDKs only supports logging out from FB, and then you can use the callback for logging the user out from your own site.
In this case you want to logout the user from your own site but not FB - then you should not use the SDK for logout, as this is used to logout the user from FB.
Instead you will have to make some kind of "reverted" login system.
If the user logs in with FB then set a session/cookie "mySiteLogin".
When checking for authorization, check both the FB-login AND "mySiteLogin".
When the user clicks logout unset/delete "mySiteLogin".
This is just a solution of the top of my head. But I too was not able to find any out-of-the-box solution.
There's three things that are all trying to do something with login
status: true
FB.getLoginStatus(function(response)
FB.Event.subscribe('auth.login'
When status is set to true, the SDK will call facebook to see if the current user is authenticated. Then you also have a check again of getLoginStatus and then while that is running async, you subscribe to the auth.login.
auth.login will be called even from the status: true call and possibly again from the getLoginStatus call.
Instead of doing alerts which interrupt the flow, do console.logs so you can see what's being called when.
As for this question: "I do not want to log them out of facebook from my app. Is this even possible?"
Yes, you can log the user out of your app by sending an HTTP DELETE to me/permissions with that user's valid access token. This will force them to reauth your app the next time. It's about the only effective way I know of to get them "out of my app" but not log them out of their facebook session.
How do I get permission on an application I have on a fan page tab and stay on the current tab?
I am collecting permissions on the application fine, but when I put the application onto a tab, it goes haywire seemingly getting caught in a never-ending loop and never going anywhere.
You could do this with the JavaScript SDK:
//Facebook connection with the JavaScript SDK
FB.init({
appId: 'YOURAPPID',
cookie: true,
xfbml: true,
status: true });
FB.getLoginStatus(function (response) {
//If you have permissions already
if (response.session) {
//Do application stuff...
}
else {
//Redirect browser to the permission dialogue
top.location="https://www.facebook.com/connect/uiserver.php?app_id=YOURAPPID&method=permissions.request&display=page&next=REDIRECTPAGEURI&response_type=token&fbconnect=1&perms=email,read_stream,publish_stream,offline_access";
}
});
You put in your application ID in the fb.init function, and then adjust the redirect for the permissions dialogue so it includes your application ID, the URI you want to re-direct to after the user accepts the permission dialogue, and finally the permissions you want to get (in this case I included email, read stream, publish stream and offline access token).