Login with facebook not working, cases refresh loop - facebook

On one of my websites, we have implemented the Login with facebook script. It was working fine till yesterday but suddenly there seems to be a problem with the script. If I am already logged in facebook, my website's page keeps on refreshing. If I log out of facebook then the refresh stops.
If this is facebook's script problem then I think there would be many other people who are facing this problem. Is any one here also facing this problem ?
please share and provide the solution if there is any.
Thanks
Ishan

We had the same issue and we started using Fb.getLoginStatus instead of FB.Login and redirected the users based on their status to the login page manually.
FB.getLoginStatus(function (response) {
if (response.status === 'connected') {
// the user is logged in and has authenticated your
// app, and response.authResponse supplies
// the user's ID, a valid access token, a signed
// request, and the time the access token
// and signed request each expire
FB.api('/me', function (userDetails) {
LoadRegForm(userDetails);
});
} else if (response.status === 'not_authorized') {
Rediret to facebook oauth page
top.location.href = 'https://www.facebook.com/dialog/oauth?client_id=<%= ConfigurationManager.AppSettings["fbappid"] %>&redirect_uri=<%= ConfigurationManager.AppSettings["fbcanvasurl"] %>&scope=email,user_birthday,user_education_history';
} else {
// the user isn't logged in to Facebook.
top.location.href = 'https://www.facebook.com/dialog/oauth?client_id=<%= ConfigurationManager.AppSettings["fbappid"] %>&redirect_uri=<%= ConfigurationManager.AppSettings["fbcanvasurl"] %>&scope=email,user_birthday,user_education_history';
}
You can even call the FB.Login function in the two else blocks instead of the redirect.

Related

Chrome blocks FB.login()

I have a FB app which need to be integrated in a FB page tab. In app I want to provide a "Signup with FB login" option. This button when clicked should prompt the user to login into FB login dialog. On successful login it should prompt the user to authenticate and allow the app to use his details. Once the user allows the app to access the user details it should then post the details to my website in a new window.
This process works fine when I test the app independently. However when I add the app to the fb page, chrome blocks the Fb login dialog. Before opening the Fb login dialog I check if the user is already logged in FB and has accepted the app. For that I use FB.getLoginStatus(checkLoginStatus); I figured due to this check the context moves to script execution and hence Chrome blocks the login dialog.
Is there a work around for this issue? Help would be highly appreciated.
My code is as follows:
The facebook button is created using span and the id fbc-login-button is given to an a tag.
$("#fbc-login-button").click(function(){
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
console.log('Logged in.');
if (response.authResponse) {
fbAppSignup(response);
}
}
else {
FB.login(function(response) {
if (response.authResponse) {
fbAppSignup(response);
}
},{scope: "email, user_friends",display:"popup"});
}
});
function fbAppSignup(response,myPopup){
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
FB.api("/me", function(response) {
$("#social_media_data").val(JSON.stringify(response));
$("#medium").val("facebook");
$("#accessToken").val(accessToken);
$("#socialClickSource").val("fbapp_facebook_signup");
$("#fbSignUp").submit();
return true;
});
}
The example in the Facebook docs is a bit misleading, you should never use FB.login in an asynchronous callback function - and that is exactly what you are doing right now, because FB.getLoginStatus is asynchronous. Always call FB.login on user interaction (mouse click) or it will get blocked by intelligent browsers.
FB.getLoginStatus: on page load, for refreshing the user session and
checking if the user is authorized already
FB.login: on user interaction
Other threads i´ve answered about that problem:
Facebook login popup blocked
FB.api response callback async popup blocked
Sign In with FB issue: FB popup window with the Login dialog is blocked by a web browser

How to authenticate Facebook User after receiving response.status === 'connected'?

Perhaps I am going about this the wrong way but I have a website that allows facebook login.
If the user has already registered on my website
and is logged into facebook but not logged into my site
when visiting the login page i check for their facebook login status and get response.status === 'connected' via-
FB.Event.subscribe('auth.authResponseChange', function (response)
{
if (response.status === 'connected')
{
var s = JSON.stringify(response.authResponse);
LogMeIn(s, function(response)
{
HandleAjaxError(response, function(msg)
{
window.location = '/_/';
});
});
}
}
I then want to pass their authResponse object to the server and confirm that this userid works with this token before I log them in as this user
I have read to simply grab the json contents of -
https://graph.facebook.com/{userID}?access_token={accessToken}
and if it does not return an error then it is good! But when testing this method I noticed that the same access_token worked for two different user ids (meaning it did not return an error for the userid that was not logged in on my computer). Instead it returned the facebook user object with name , location etc.
This really surprised me, as I expected the access_token to work only with a single user id.
In an effort to prevent someone from simply changing the user id before continuing the script I need to authenticate via server side. What is a way to accomplish this?
Proof, go to these links to see profile information
My profile-
https://graph.facebook.com/1233822590?access_token=CAACCBJJZBgjABAOGmvmsou8gMYGulLHTgAr5ZCHZAU7pKEp0cMAeX8r4qHLpiVuZCOT1v0ulMZAxX5YfLJkcZBr9l6qJQoPxWS5Fs5ndohDnH6ZAPPfZCZCTQtwWgAZAg6I1PAOIpdtCc0OUaMmBZAvGiMm9gQhmNXRbocZD
Another userid with same access_token-
https://graph.facebook.com/100000116781159?access_token=CAACCBJJZBgjABAOGmvmsou8gMYGulLHTgAr5ZCHZAU7pKEp0cMAeX8r4qHLpiVuZCOT1v0ulMZAxX5YfLJkcZBr9l6qJQoPxWS5Fs5ndohDnH6ZAPPfZCZCTQtwWgAZAg6I1PAOIpdtCc0OUaMmBZAvGiMm9gQhmNXRbocZD
Nothing to be surprised. You can fetch the basic details of any user of the facebook using the access token of any user of the facebook.. So this isnt really good way to validate the token. Moreover, that confirmation of token part isnt required.
If you want the authorization through server side go through.this link

how to determine if a user has confirmed or canceled signin via facebook javascript sdk

I am logging users into a web site via facebook's Javascript SDK. After the user clicks the "log in through fb" button, I would like to generate different responses depending on whether the user click "ok" or "cancel" in facebook's confirmation. Here is the code I use when they click the fb button.
$("#fb").click(function() {
FB.login(function(response){
FB.api('/me',function(response){
// I believe the test to see if they are logged in or not should go here
});//FB.api
},{scope:'publish_actions, email, user_likes, user_location'});
});
Any advice is appreciated. Thanks!
According to facebook's documentation:
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
// the user is logged in and has authenticated your
// app, and response.authResponse supplies
// the user's ID, a valid access token, a signed
// request, and the time the access token
// and signed request each expire
alert('a');
} else if (response.status === 'not_authorized') {
// the user is logged in to Facebook,
// but has not authenticated your app
alert('b');
} else {
// the user isn't logged in to Facebook.
alert('c');
}
});
It worked for me. Hope it helps someone else.

FaceBook Javascript SDK OAuth authorization when user already logged in on FB

I'm trying to find solution for situation when user is logged out from my app, but still is logged in on facebook, and trying to log in via OAuth to my app again.
I'm checking authorization status by listening to 'auth.login' event.
When user in this situation clicks facebook-connect button, pop-up fires up, gets self-closed and then nothing happens(because user was already logged in on facebook, login event is not fired). If I add getLoginStatus() check, then user gets logged in automatically to my app, when opening the page, even if he didnt click facebook-connect button(thats what I dont want) Any ideas? Thanks!
Specify here your execution code when user already logged in this FB event.
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
// the user is logged in and has authenticated your
// app, and response.authResponse supplies
// the user's ID, a valid access token, a signed
// request, and the time the access token
// and signed request each expire
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
} else if (response.status === 'not_authorized') {
// the user is logged in to Facebook,
// but has not authenticated your app
} else {
// the user isn't logged in to Facebook.
}
});

Display app Canvas page before authorization popup

I'm developping a facebook canvas app with the new Auth Dialog : https://apps.facebook.com/evaway_us/
My problem is that users always have to authorize the application before seeing anything and I have a terrible conversion rate.
How can I make my canvas app display a page prior to any user action requiring authorization ?
Like this : http://apps.facebook.com/tradablebits/
I finally found the solution :
I had "Authenticated Referrals" activated in the new Auth Dialog Menu.
As soon as I unchecked this option, I was able to render my canvas page before the authorization popup.
Using Javascript SDK, use the FB.getLoginStatus() function to determine what page the user should see. See http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/ for more information on how to use that function.
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
// the user is logged in and connected to your
// app, and response.authResponse supplies
// the user's ID, a valid access token, a signed
// request, and the time the access token
// and signed request each expire
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
} else if (response.status === 'not_authorized') {
// the user is logged in to Facebook,
//but not connected to the app
} else {
// the user isn't even logged in to Facebook.
}
});