In my Canvas App (tab page) I use this code to get the AccessToken if the app needs it:
var accessToken = "";
FB.getLoginStatus(function (response) {
if (response.authResponse || response.status === 'connected') {
accessToken = response.authResponse.accessToken;
}else {
alert( response.status );
}
} );
return accessToken;
I works fine. BUT if user opens the app and leave it for about 30minutes (or less or more, just for a long time) after this functions can't get the accessToken just return with an empty string. In the console log there aren't any error. After if the user refresh the page everything is fine...
What should I do to can get the accessToken anytime?
Here's what's going on:
The FB.getLoginStatus method is done asynchronously, and you give it a callback to execute once finished.
In your code you return the accessToken right after issuing the async request, but you're not waiting for it to be completed.
It should look like:
FB.getLoginStatus(function (response) {
if (response.authResponse || response.status === 'connected') {
return response.authResponse.accessToken;
} else {
alert( response.status );
}
});
So you might ask yourself "so why does it work to begin with?", the answer is simple: at first the sdk has the authentication data and does not need to actually make the request to the fb servers, as it states in the documentation of the method:
Roundtrips to Facebook's servers
To improve the performace of your application, not every call to check
the status of the user will result in request to Facebook's servers.
Where possible, the response is cached. The first time in the current
browser session that FB.getLoginStatus is called, or the JD SDK is
init'd with status: true, the response object will be cached by the
SDK. Subsequent calls to FB.getLoginStatus will return data from this
cached response.
If you try your code with passing `true', like this:
var accessToken = "";
FB.getLoginStatus(function (response) {
if (response.authResponse || response.status === 'connected') {
accessToken = response.authResponse.accessToken;
} else {
alert( response.status );
}
}, true);
return accessToken;
Then it should not work at all.
Call FB.login in such a case, that just opens the popup and immediately closes it again, if the user is still logged into FB and you don’t request any new permissions.
Related
The below code is my Facebook API javascript so far. It's pretty simple, with a bunch of console.log()s to follow the code flow. (I recognize that naming arguments response and response2 is terrible practice but it's just what I put quickly for now to avoid naming conflicts).
As it stands, FB.init() succeeds, FB.getLoginStatus() works, and the two FB.api() calls work, but FB.login() never happens. It is async though so the console.log()s just before and just after do execute. To summarize, my console output is:
makes it here
makes it here too
Permissions:
Object {data: Array[37]}
Good to see you, my-name-is-here.
I guess it's because the async FB.login() call never gets a response so the callback never fires, thus no console.log()s from inside the function. But I need this FB.login() in order to get extended permission ads_management. Any idea what is wrong, or at least a direction to go about solving this myself?
window.fbAsyncInit = function() {
FB.init({
appId: 'my-app-id-is-here',
xfbml: true,
version: 'v2.0'
});
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
FB.api('/me', function(response2) {
console.log("Good to see you, " + response2.name + ".");
});
FB.api('/me/permissions', function(response2) {
console.log("Permissions:");
console.log(response2);
});
console.log("makes it here");
FB.login(function(response2) {
console.log("why not here?");
if (response2.authResponse) {
console.log("Response to login asking for ads_management permission");
console.log(response2);
} else {
console.log("User cancelled login or did not fully authorize.");
}
}, {
scope: 'ads_management',
return_scopes: true
});
console.log("makes it here too");
} else {
// filled with other code that doesn't effect this question yet
}
});
};
UPDATE:
Taking away the parameters argument {scope: 'ads_management', return_scopes: true} makes the FB.login() call at least be attempted, but in the console there is now the error:
"FB.login() called when user is already connected."
but I thought the way to get more permissions when the user is already logged in IS by calling FB.login() again, with the desired permissions specified in the parameters argument.
Your flow is not correct. First check for the permission in the FB.api("/me/permissions") callback (since the facebook api calls are asynchronous), and then if that particular permission is not yet granted, then call FB.login().
Here you go-
if (response.status === 'connected'){
FB.api('/me/permissions', function(response){
var hasPermission = false;
var response = new Array();
response = response.data;
response.map(function (data) {
if (data.permission == "ads_management" && "status" == "granted") {
hasPermission = true;
}
});
if(!hasPermission)
// call FB.login() here
});
}
Try to use oauth:true in your FB.init.
And you should check by code if you don't already have needed permission before issuing FB.login.
I'm trying to login users automatically into my site who have already allowed our facebook app, initially I was going to use :
var cb = function(response) {
if (response.status === 'connected') {
FB.api('/me', function(response) {
$.post( url, { 'op':'facebook','name':response['name'],'id':response['id'],'email':response['email']},
function( data ) {
parent.location.reload();
});
});
} else {
alert('You are not logged in');
}
};
FB.login(cb, { scope: 'publish_actions,publish_stream,read_stream,email' });
Although using that it opens a facebook popup, blocked by many popup blockers and browsers when done in an automatic manner like this and will also display for users who have no allowed our app.
I want it to be done descretely but I'm not sure how :S
If anyone could show me how to log them in using javascript that would be great :)
Prompting a user to login should be hinged off of a user generated event, like clicking on an element. Most browsers will block attempts to automatically open new windows unless there is enough confidence that the user has requested the action.
If you want to automatically detect a visitor's login status when they load your page, you should hook onto the various auth events exposed by the Javascript SDK ("auth.authResponseChange", "auth.login", etc), or manually request the visitor's status using the "FB.getLoginStatus" method. You can read more about these events at https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/
Managed to get it working! Read the facebook tutorial again and this is what I came up with
window.onload=function(){
var url = "http://mysite.com/";
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
FB.api('/me', function(response) {
$.post( url, { 'op':'facebook','name':response['name'],'id':response['id'],'email':response['email']},
function( data ) {
parent.location.reload();
});
});
}
});
};
My application uses Facebook authentication:
FB.init({
appId: config.fbAppId,
status: true,
cookie: true,
// xfbml: true,
// channelURL : 'http://WWW.MYDOMAIN.COM/channel.html', // TODO
oauth : true
});
// later...
FB.login(function(response)
{
console.log(response);
console.log("authId: " + response.authResponse.userID);
gameSwf.setLoginFacebook(response.authResponse.accessToken);
}, {scope:'email,publish_actions,read_friendlists'});
And when using it, people can post to their wall:
var obj = {
method: 'feed',
link: linkUrl,
picture: pictureUrl,
name: title,
caption: "",
description: message
};
function callback(response) {
// console.log("Post on wall: " + response);
}
FB.ui(obj, callback);
This works fine, but there is one little hickup. If people:
Log in on the app.
Log out of Facebook.
Attempt to make a wall post from the app.
The opening of the wall post dialog fails. The console says "Refused to display document because display forbidden by X-Frame-Options.".
Can I instead get Facebook to show a login prompt to the user. Or can I detect the error and tell the user that he's no longer logged in on Facebook?
Just recall getLoginStatus BUT forcing a roundtrip to Facebook. Look following code:
FB.getLoginStatus(function(response) {
// some code
}, true);
Look the last parameter set to true to force the roundtrip.
From JS SDK documentation:
To improve the performance of your application, not every call to
check the status of the user will result in request to Facebook's
servers. Where possible, the response is cached. The first time in the
current browser session that FB.getLoginStatus is called, or the JS
SDK is init'd with status: true, the response object will be cached by
the SDK. 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.
(http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/)
What you could try and use is the FB.getLoginStatus where if the user is connected this would allow them to complete the wall post.
If they aren't connected then call the FB.login method before they can post on the wall.
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.
}
});
http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/
There are also the events for login and logout that you can watch for and do something with those responses.
FB.Event.subscribe('auth.login', function(response) {
// do something with response
});
FB.Event.subscribe('auth.logout', function(response) {
// do something with response
});
http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/
I'm trying to log out of a website i've created with Facebook integrated.
Logging in works fine, but when I want to log out Firebug consistently gives me this error:
FB.logout() called without an access token.
I'm using the Facebook JavaScript SDK, and the code I've got to logout looks like this:
$(document).ready($(function () {
$("#fblogout").click(facebooklogout);
}));
function facebooklogout() {
FB.logout(function (response) {
}
)};
This is the logout code specified at the Facebook Developers Documentation just with a button being assigned the method on document.ready
Before this code I have the FB.init() method, that all runs fine.
If anyone's got a solution as to why FB.logout doesn't have an access token, it'd be appreciated.
To logout from the application which uses facebook graph API, use this JavaScript on the logout page just after the <form> tag:
window.onload=function()
{
// initialize the library with your Facebook API key
FB.init({ apiKey: 'b65c1efa72f570xxxxxxxxxxxxxxxxx' });
//Fetch the status so that we can log out.
//You must have the login status before you can logout,
//and if you authenticated via oAuth (server side), this is necessary.
//If you logged in via the JavaScript SDK, you can simply call FB.logout()
//once the login status is fetched, call handleSessionResponse
FB.getLoginStatus(handleSessionResponse);
}
//handle a session response from any of the auth related calls
function handleSessionResponse(response) {
//if we dont have a session (which means the user has been logged out, redirect the user)
if (!response.session) {
window.location = "/mysite/Login.aspx";
return;
}
//if we do have a non-null response.session, call FB.logout(),
//the JS method will log the user out of Facebook and remove any authorization cookies
FB.logout(handleSessionResponse);
}
The code works and is live on my site.
I went for the less trivial solution:
function facebookLogout(){
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
FB.logout(function(response) {
// this part just clears the $_SESSION var
// replace with your own code
$.post("/logout").done(function() {
$('#status').html('<p>Logged out.</p>');
});
});
}
});
}
Figured it out after so many tries.
Generally response.authResponse.accessToken contains token. So, its error about the accessToken not being there.
Think logically, where does that response come from in your code? Out of nowhere.
So, we need to get that response object from a function and get this working.
I don't know how it worked for others, but this worked for me.
Just replace the code with this
function logout(){
FB.getLoginStatus(function(response) {
FB.logout(function(response){
console.log("Logged Out!");
window.location = "/";
});
});
}
What we do here is, get the login status if the user is logged in and get the corresponding response in return, which contains all the necessary tokens and data. Once this is fetched, the token is used to log out the user.
I've tried something like this:
function fbLogout(){
if(typeof FB.logout == 'function'){
if (FB.getAuthResponse()) {
FB.logout(function(response) { window.location.href = PROJECT_PATH + '/index/logout'; });
return;
}
};
window.location.href = PROJECT_PATH + '/index/logout';
return;
}
Should be something more like this. There was a change to the JS API where you have to use authResponse instead of just session.
//handle a session response from any of the auth related calls
function handleSessionResponse(response) {
//if we dont have a session (which means the user has been logged out, redirect the user)
if (!response.authResponse) {
return;
}
//if we do have a non-null response.session, call FB.logout(),
//the JS method will log the user out of Facebook and remove any authorization cookies
FB.logout(response.authResponse);
}
The error says that you don't have an access token, you have to check for one using the FB.getAccessToken() function.
If there is no access token the function returns null. See example below:
function facebooklogout() {
try {
if (FB.getAccessToken() != null) {
FB.logout(function(response) {
// user is now logged out from facebook do your post request or just redirect
window.location.replace(href);
});
} else {
// user is not logged in with facebook, maybe with something else
window.location.replace(href);
}
} catch (err) {
// any errors just logout
window.location.replace(href);
}
}
With Typescript this function do work fine ..
signOutFacebook(): void {
/*SIGN OUT USER FACEBOOK.*/
FB.getLoginStatus(function (response) {
if (response.status === 'connected') {
FB.logout(function (response) {
console.log("Logged Out!");
});
} else {
console.log("The person is not logged into your webpage or we are unable to tell. !");
}
});
}/*FINAL 'signOutFacebook()'. */
I am trying to get permissions for a facebook app I am making, but every time I try to run the app in IE8 I cannot get the permissions box to show up. I have tested the app in firefox and it can open fine, and get all the permissions fine (i dont ask for any special ones).
When I run the debugger in IE8 I see that once the program hits FB.getLoginStatus(function (response) { (see code below) it then moves into an infinite loop of code written by facebook.
I think the issue is because of how I am making the permissions call. I have a form that I use for a login that will call the permissions method once the user attempts to login to the site. Here is the form and button in the form I use:
<form id = "membershipInfo" method = "post" action = "Login.aspx">
<input type = "button" id = "submitInfo" class = "MemberInfo" value = "Take Me There!" onclick = "authorize(acceptPermissions, rejectPermissions)"/>
And here is the auth method I use:
function authorize(successCallback, failureCallback) {
FB.getLoginStatus(function (response) {
//****** DOES NOT MAKE IT PAST HERE *******//
if (response.session) {
// logged in and connected user, carry on
session = response.session;
//Set access token
accessToken = response.session.access_token;
//Call success callback
successCallback();
} else {
// no user session available, Lets ask for perms
FB.ui(
{
method: 'permissions.request',
perms: permissionString //(equals "" )
},
function (response) {
if (response && response.session != null) {
//Get session
session = response.session;
//Set access token
accessToken = response.session.access_token;
//Call success callback
successCallback();
} else {
//Call failure callback
failureCallback();
}
});
}
});
When the user accepts permissions they get moved into a success callback method which is here (never makes it this far):
function acceptPermissions() {
//Code done before moving on
$('#submitInfo').submit();
}
Anyone see any issues?
That looks like it should work to me, so probably a good opportunity to file a bug report with Facebook....
That said, I think you could clean up your code using FB.login instead http://developers.facebook.com/docs/reference/javascript/FB.login/
FB.login(function(response){
if(response.session){
// logged in and connected user, carry on
session = response.session;
//Set access token
accessToken = response.session.access_token;
//Call success callback
successCallback();
}
else{
failureCallback();
}
}, {perms: permissionString});
So here's a question: do you have Flash installed? IE8, being the way it is, may be trying to load the Flash-based XD, and then failing silently. If you install Flash (and/or put in a catch for that), does it work?