I am running into a problem with logging in to Facebook on Safari and IE. I can login just fine with Chrome and Firefox with the following code:
var appId = 'APP ID';
var uid;
// Initialize the JS SDK
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
channelUrl: '//localhost:8888/photo/channel.html' // Channel File
});
// Get the user's UID
FB.getLoginStatus(function(response) {
uid = response.authResponse.userID ? response.authResponse.userID : null;
console.info(uid);
});
function authUser() {
FB.login(function(response) {
console.info(response);
uid = response.authResponse.userID ? response.authResponse.userID : null;
console.info("called");
}, {scope:'email,publish_actions'});
but when my code gets to FB.getLoginStatus on Safari and IE the response shows
authResponse: undefined
status: "unknown"
Edit: Forgot to mention that the popup that shows the permissions is not popping up in Safari and IE.
If the status is "unknown" that means one of two things:
the user is not logged in, or
third party cookies are disabled
Safari is the only browser to come with third-party cookies disabled by default (Firefox will be following suit shortly). Some of the higher security settings in IE will also turn them off. Since your code is working in Firefox/Chrome I would guess this is the culprit.
Unfortunately, third-party cookies are required for FB.getLoginStatus to return an appropriate authResponse and status. I think your options are pretty limited:
Let the user log in through PHP or another back-end SDK, and force them to sign in again every 2 hours (I think FB tokens expire every 7600 seconds)
Detect the "unknown" status and display a message to the user asking them to enable third-party cookies for facebook.com
I didn't actually fix the problem I was able to get around it by running the app on Facebook instead of my localhost. I believe this is because when on Facebook I am already 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
Can someone please help me with this? This is happening on production environment too. :(
I have checked other threads here, but they didn't help.
Getting an error after facebook login dialog closes -
"Given URL is not allowed by the Application configuration.: One or more of the given URLs is not allowed by the App's settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App's domains."
I'm trying this on localhost. It's not working on production environment either.
It was working on both localhost and production environments 2-3 weeks back.
I have cross-checked all the URLs on facebook app.
Details:
App Domains: localhost
Canvas URL:[http://localhost:8080/app/core/main/public/fb.jsp?fromFB=true]
Secure Canvas URL:[https://localhost:8443/app/core/main/public/fb.jsp?fromFB=true]
Site URL:
[http://localhost:8080/app/core/main/] (tried with [http://localhost:8080] too, doesn't work)
Page Tab URL: [http://localhost:8080/app/core/main/public/fb.jsp?fromFB=true]
Secure Page Tab URL: [https://localhost:8443/app/core/main/public/fb.jsp?fromFB=true]
Have enabled "App on Facebook" under "App Center Listed Platforms".
Same configuration was working earlier.
I'm using JSSDK -
FB.init({appId: 'XXXXXXXX',
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
FB.login(function(response)
{
if (response)
{
if (response.status == 'connected')
{
//showUserPages();
}
else if ('unknown' == response.status && null != response.authResponse)
{
loginIntoFB();
}
}
},
{ scope: 'manage_pages' });
Did facebook add any validations recently for the apps ?
Please let me know if i can provide any more information.
PS: Posting for the first time, please pardon me for any mistakes.
Issue was because of the local referenced facebook js sdk. Missed to notice that caching js sdk on local is against TOS. It is working after referring to updated facebook sdk - connect.facebook.net/en_US/all.js
Thanks!
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 have an issue with the Facebook OAuth 2.0 mechanism. In principle all is working well, except for one thing: when a user is redirected to the page where he should authorize/permit the app but is clicking 'Cancel', about half of the time he is redirected to the page I specified in the redirect_uri (correct behaviour - so I redirect him to a page explaining why we need the permissions) and about half the time he is ending up on the FB homepage (wrong behaviour). I just can't figure out what I am doing wrong. This is roughly what I am doing:
window.fbAsyncInit = function()
{
FB.init({
appId : <appid>, // App ID
channelUrl : 'http://www.mydomain.com/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
// Additional initialization code here
FB.getLoginStatus(function(response)
{
//console.log('getLoginStatus response: ',response);
if (response.authResponse)
{
//user is already logged in and connected
top.location.href='http://apps.facebook.com/<appname>';
}
else
{
//app is not authorized or user is logged out
var redirectURL = 'http://www.facebook.com/dialog/oauth/?client_id='+client_id+'&scope='+scope+'&redirect_uri='+encodeURIComponent('http://apps.facebook.com/<appname>')+'&response_type=token';
top.location.href = redirectURL;
}
});
};
Any idea what I am doing wrong? As said in the opposite case, where the user does accept to authorize the app al works just fine. I am still working in sandbox mode and have not yet bought an SSL certificate which is why I am still referring everywhere to http instead of https.
Thanks!
P.S. This strange behaviour never happens when the user clicks 'Don\'t allow' when asking for optional permissions the following times the user accesses my app. For example, the user logs in for the first time and authorizes the app, but does not allow for the optional permissions. Facebook then redirects him to the redirect_uri and gives me an access_token, so I redirect the user to the app (so far so good). The next time when the user accesses the app, I detect that he has authorized the app, but that I don't have all the optional permissions I want, so I redirect him again to the OAuth 2.0 mechanism. This time the user AGAIN doesn't allow the optional permissions and Facebook ALWAYS redirects the user to the redirect_uri which is the expected behaviour.