My Facebook authentication has stopped working all of a sudden. Has FB changed something? I am running the site from localhost at the moment using FB Javascript SDK. None of the following FB code is working?
alert("got here");
window.fbAsyncInit = function () {
alert("didn't get here");
FB.init({
appId: '102671026556892', // App ID
//appId: '384834001576531', // App ID
channelUrl: '//localhost/channel.html', // Channel File
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) {
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;
FB.api('/' + uid, function (user) {
if (user) {
loginUser(uid, user.email, user.name);
window.location = "/users/index.html";
}
});
// check an load DB
// TODO: Handle the access token
} 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.
}
});
};
alert("got here too");
// Load the SDK Asynchronously
(function (d) {
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) { return; }
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
alert("got here as well");
The alert that are not in the window.fbAsyncInit display fine. The one in the window.fbAsyncInit does not. It doesn't render the login button (code below)
<!-- START of Facebook LOGIN BUTTON -->
<div id="fb-root"></div>
<div class="fb-login-button" data-show-faces="false" data-width="400" data-max-rows="1" data-size="medium" data-colorscheme="light" scope="user_about_me, email, read_stream, publish_actions">Login with Facebook</div>
<!-- END of Facebook LOGIN BUTTON -->
Any help greatly appreciated. It all worked at the end of last week. :(
Related
When I use the following link from my app in case the user is not logged in Facebook the Facebook login shows and then user authenticate the app and then the app shows.
Facebook
If user is logged in and search for the app from the Facebook search box then it shows the default.aspx with a Facebook login button.
How can I show the user the authorization dialog instead of the Login button ?
Following is the default.aspx javascript -
<script type="text/javascript">
window.fbAsyncInit = function () {
FB.init({
appId: '521577774587246', // App ID
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
// Additional initialization code here
FB.Event.subscribe('auth.authResponseChange', 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;
// TODO: Handle the access token
// Do a post to the server to finish the logon
// This is a form post since we don't want to use AJAX
var form = document.createElement("form");
form.setAttribute("method", 'post');
form.setAttribute("action", 'loadMainPage.ashx');
var field = document.createElement("input");
field.setAttribute("type", "hidden");
field.setAttribute("name", 'accessToken');
field.setAttribute("value", accessToken);
form.appendChild(field);
// alert(accessToken);
document.body.appendChild(form);
form.submit();
} else if (response.status === 'not_authorized') {
// the user is logged in to Facebook,
// but has not authenticated your app
window.top.location = "https://www.facebook.com/dialog/oauth?client_id=521599834587246&redirect_uri=http://localhost:55549/fb/&scope=email,read_stream";
} else {
// the user isn't logged in to Facebook.
}
});
};
// Load the SDK Asynchronously
(function (d) {
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) { return; }
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
} (document));
</script>
As suggested in this post I used FB.login instead the FB.Event.subscribe('auth.authResponseChange' and now it asks for authorization.
I'm using Parse Javascript SDK to authenticate to Facebook and even though I get a success after login, my Facebook session is not created. Here is the code I use,
<div id="fb-root"></div>
<script>
// Additional JS functions here
window.fbAsyncInit = function() {
Parse.FacebookUtils.init({
appId : 'xxxx', // Facebook App ID
// channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow Parse to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
function fLogin() {
Parse.FacebookUtils.logIn(null, {
success: function(user) {
alert("login success with user " + JSON.stringify(user));
if (!user.existed()) {
alert("User signed up and logged in through Facebook!");
} else {
alert("User logged in through Facebook!");
}
//FB.api('/me', function(response) {
// alert("got fb me api=" + JSON.stringify(response));
//});
},
error: function(user, error) {
alert("User cancelled the Facebook login or did not fully authorize.");
}
});
}
</script>
<button class="btn-facebook btn-large" onclick="fLogin();"><img src="./img/fb_icon.png"> <span class="btn-facebook-text">Login with Facebook</span></button>
After the popup window opens and I log into Facebook, I get the console message "login success with user " and I can see the access token. However when I try to call FB.api ("/me")... I get an error saying Invalid access token from Facebook.. And When I go back to Facebook, I see that it didn't log me into Facebook either...
If I replace this whole code with FB.init() and FB.login() it works just fine.. Its when I replace it with Parse FacebookUtils that I get the error.
Any help will be greatly appreciated.
I want to get the access token for facebook and I got this code from facebook developer website but it can't generate or give me any access token . I use this code in a simple text file not any of my website.
<div id="fb-root"></div>
<script>
<div class="fb-login-button" data-show-faces="true" data-width="400" data-max-rows="1"></div>
window.fbAsyncInit = function() {
FB.init({
appId : '377263832388887', // App ID
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) {
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;
// TODO: Handle the access token
} 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.
}
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
});
</script>
I want to get access token so that I can further proceed for my work. Thank you.
consider using this code provided by http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/
replace the FB.Event.subscribe function with the following.
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
// dump success data here, and dump response data if needed
} else if (response.status === 'not_authorized') {
// dump fail data here
} else {
// dump other fail data here
}
});
Although I see on http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/ that the FB.Event.subscribe should also have the access code in its result array. Have you tried dumping the 'response' to console, to view the results?
I have a problem with the authenticated referrals in the Auth Dialog. When a user uses the app for the first time and is requesting authorization, he/she gets "The App will receive: Your basic data." which is different from what is displayed when I preview the Auth Dialog in Facebook developer Apps site. I use the following code:
<script>
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
// Init the SDK upon load
window.fbAsyncInit = function() {
FB.init({
appId : '<%= Facebook::APP_ID %>', // App ID
channelUrl : '//'+window.location.hostname+'/channel', // Path to your Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
url = '<%= users_path %>'
// listen for and handle auth.statusChange events
FB.Event.subscribe('auth.statusChange', function(response) {
if (response.authResponse) {
// user has auth'd your app and is logged into Facebook
FB.api('/me', function(me){
if (me.name) {
window.open(url);
}
})
} else {
// user has not auth'd your app, or is not logged into Facebook
document.getElementById('auth-loggedout').style.display = 'block';
}
});
// respond to clicks on the login and logout links
document.getElementById('auth-loginlink').addEventListener('click', function(){
FB.login();
});
}
replaced FB.login() with
FB.login(function(response) {
// handle the response
}, {scope : 'user_likes'}); });
My App on Facebook uses the JavaScript SDK. When a user navigates to my app page and goes to my app, a popup asks them to authorize the app. This works well.
However, if they authorize the app, then return to it later, another pop-up (which i believe to be another authorization window) will quickly open then close.
What is my code is doing this? Code is below.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '221953271200525', // App ID
channelURL : '//www.vidjahgames.com/fall/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.login(function(response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: 'email'});
};
// Load the SDK Asynchronously
(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.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
FB.login makes the popup appear, so you should first know if the user is logged in and if not make the login popup appear:
FB.getLoginStatus(function(response) {
if (response.session) {
// A user has logged in, and a new cookie has been saved
FB.api('/me', function(response) {
_userName = response.name;
alert("hello"+_userName);
}.bind(this));
} else {
FB.login(function(response) {
// the rest of your code here...
}
}
});