How can I get a notification when the user logs out from facebook.com? - logout

The user is logged in to my site using the latest PHP SDK.
If the user clicks the facebook logout URL that appears in my site, he logs out from facebook and is redirected back to my site where I can do some cleanups.
However, if while in session (in my site and in facebook) the user goes to www.facebook.com and logs out from there, my site is clueless about it. I need to be notified about this in my site so I can do cleanups.
The only solution I can think of is to call from every page in my site to getLoginStatusUrl(), but this seems to be an overkill. Isn't there a way to ask facebook to call some URL in my site when the user logs out from facebook itself?

You can use js to subscribe to the auth.logout event as per the facebook example:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '<?php echo $facebook->getAppID() ?>',
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
FB.Event.subscribe('auth.logout', function(response) {
window.location.reload();
});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

Related

Facebook login authentication iFrame not loaded properly in safari browsers

I am new to Facebook app development. Following is my html and script code to retreive access token for facebook users.
I am having a checkbox and on Selecting the checkbox, I need the facebook login authentication form to be loaded.
<html xmlns:fb="https://www.facebook.com/2008/fbml">
<body>
<table>
<tr>
<td>
<input type="checkbox" value="Facebook" name="facebook" id="facebook" onclick="checkFacebookLoginCredentials(this,'fb')"/>
<div id="fb-root"></div>
</td>
</tr>
</table>
</body>
<script type="text/javascript">
var userFBAccessToken="";
function checkFacebookLoginCredentials(field, accountType)
{
loadFBAuthenticationWindow(); //Function to load the facebook login authentication window
}
function loadFBAuthenticationWindow()
{
window.fbAsyncInit = function()
{
FB.init({
appId : 'MY_APP_ID', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
oauth : true
});
FB.login(function(response)
{
if (response.authResponse)
{
console.log('Welcome! Fetching your Facebook information....');
userFBAccessToken = response.authResponse.accessToken;
console.log('userFBAccessToken: ' + userFBAccessToken);
FB.api('/me', function(response)
{
console.log('Good to see you, ' + response.name + '.');
FB.logout(function(response) {
console.log('Logged out.');
});
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: 'user_activities,user_notes,user_photos,user_videos,user_status,offline_access'});
};
// Load the SDK Asynchronously
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol
+ '//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
}
</script>
</html>
When I try to load the above html, I can see the iFrame (Facebook login authentication form) loaded properly in Chrome and FireFox browsers.
But when I tried to execute in SAFARI, the iFrame is not loaded.
Can anyone please say, what I have missed in the above code? Any suggestion please..
This sounds like a bug, especially if this is working in one browser but not the other. Please file this in the bugtracker: http://developers.facebook.com/bugs

fb:login-button doesnt work without show-faces

We just switched to new PHP SDK and JS today. but the problem is weird. When we dont use show-faces with perms attribute it doesnt show popup. Only way to get permission popup appear, we need to use show-faces attr.
is this a bug ?
<fb:login-button perms="email, publish_stream, offline_access, create_event, user_photos, user_online_presence, user_videos, user_website, user_events, user_relationships, user_interests" size="large">Sign Up With Facebook</fb:login-button>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '<?php echo $facebook->getAppID() ?>',
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
FB.Event.subscribe('auth.logout', function(response) {
window.location.reload();
});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
Thanks
EDIT:
OMG. i just found the solution, with the new JS SDK we must use scope instead of perms attribute!
with the new JS SDK we must use scope instead of perms attribute!
Alternatively you can use straight Javascript and make your own buttons.
<script>
function addPermissions(permissions){
FB.login(function(response) {
if (response.session) {
if (response.perms) {
// user is logged in and granted some permissions.
} else {
// user is logged in, but did not grant any permissions
}
} else {
// user is not logged in
}
}, {perms:permissions});
}
</script>
<a onclick="addPermissions("email, publish_stream,...");">Click me</a>

Facebook Check IsFan is not working, please help

<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '197724456937488', status: true, cookie: true, xfbml: true});
// this will fire when any of the like widgets are "liked" by the user
FB.Event.subscribe('edge.create', function(response) {
document.getElementById('likepost').style.display = "";
document.getElementById('falsebox').style.display = "none";
document.getElementById('fb').style.display = "";
});
FB.Event.subscribe('edge.remove', function(response) {
console.log('This was UNliked from this page: ' + window.location);
});
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<div id="fb" style="display:none">
<fb:like-box href="<?php echo $detail['Post_FB'] ;?>" width="292" height="100" show_faces="false" stream="false" header="false"></fb:like-box>
</div>
<div id="link" style="display:none">
<fb:like href="http://design-pro.co.cc/appleworld/post.php?id=<?php echo $id?>" send="false" width="450" show_faces="true" font=""></fb:like>
</div>
Use this as your starting point for reference: http://developers.facebook.com/docs/reference/javascript/FB.init/
First thing to notice is how FB.init() call is wrapped in:
window.fbAsyncInit = function() {
...
};
You are already setting 'status' to true in your init call, so you should be able to subscribe to an event which will return the status value, which tells you the user's login status.
Check out: http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/
Your FB.Event.subscribe(...) call should also be inside the same window.fbAsyncInit() call.
Once you verify that user is logged in, you can check for fan status. You still have to use the old REST API, since Facebook hasn't ported this over to Graph API: http://developers.facebook.com/docs/reference/rest/pages.isFan/
Please note: We are in the process of
deprecating the REST API, and will be
adding equivalent support to the Graph
API for this method. You should
continue to use this method until we
announce support in the Graph API.
Hope this points you in the right direction.
This tutorial might also help: http://thinkdiff.net/facebook/graph-api-javascript-base-facebook-connect-tutorial/

FB.getLoginStatus doesn't work?

The FB.getLoginStatus function doesn't work for me for some reason - although it used to for some time.
Very basic code below, and the alert never popups - looks like FB.getLoginStatus never calls the supplied function.
Any ideas ?
<body>
<form id="form1" runat="server">
<div id="fb-root">
</div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
FB.init({ appId: 'xxx', status: true, cookie: true, xfbml: true });
FB.getLoginStatus(function (response) {
alert("Hi there");
});
</script>
</form>
If your app is in Sandbox Mode see this bug: https://developers.facebook.com/bugs/240058389381072
Also read the comments by Philip Bulley
[...] Essentially sandboxed applications are invisible to non-app-developers. If there is no user currently logged into Facebook, Facebook will act as if your sandboxed application doesn't exist at all (FB obviously doesn't know you're an app developer, and thus the app is invisible!).
This bug has been confirmed and assigned.
In which platform you are developing the application??If it is FBML then check FBJS-Facebook JavaScript.I think alert will not work in FBML application.
I got this working..Just check
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: 'APP_ID', status: true, cookie: true, xfbml: false});
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
window.fbAsyncInit = function() {
FB.init({appId: 'APP_ID', status: true, cookie: true, xfbml: true});
/* All the events registered */
FB.Event.subscribe('auth.login', function(response) {
// do something with response
login();
});
FB.Event.subscribe('auth.logout', function(response) {
// do something with response
logout();
});
FB.getLoginStatus(function(response) {
if (response.session) {
// logged in and connected user, someone you know
login();
}
});
};

Facebook connect logout using link

Customer can sign in to my web app via normal login and facebook connect. So far so good.
<fb:login-button autologoutlink="true" perms="email,user_birthday,status_update,publish_stream"></fb:login-button> <div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({appId: '<xsl:value-of select="$FACEBOOK_APP_ID" />', status: true,
cookie: true, xfbml: true});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
</script>
But when they come to logout, I want the customer to click on the logoff link at my website. How can I programmatically logout facebook connect? Possibly via json backend?
I don't want customer to click facebook button to logoff.
I did try out with some ways, example: to reset the facebook connect cookie created at my website and it works, but when I try to login to facebook again at second time, it fails.
I know delete cookie logout is simply not clean (fb autologoutlink=true is still showing I haven't logout.)
I can't let customer to click logout twice, I want them to use my web app logout link as a single logout controller.
I am using ASP classic. Any solution?
If the user has logged in via Facebook, call this JS snippet when the user logs out of your site (depending on how you implement logout, one possible way is to use onclick="", or if you redirect to the "logged out" template, include it there):
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'YOUR_APP_ID', status: true, cookie: true, xfbml: true});
FB.logout(function(response) {});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
You can use this simple code:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId:'APPID HERE', cookie:true,
status:true, xfbml:true
});
</script>
and this:
<fb:login-button autologoutlink="true" length="short" background="white" size="large" data-show-faces="true" perms="email,user_birthday,status_update,publish_stream">Login with Facebook</fb:login-button>