Facebook oauth, FB.getLoginStatus & FB.logout on IE, Chrome, Firefox & Android browsers

Question

I'm using FB's oauth to successfully authenticate users, but I'm having trouble reliably logging them out using what seems to be the recommended approach: FB.logout using the FB JDK.

Specifically, calling FB.logout (after loading the FB JDK and calling FB.init) successfully revokes the FB authentication granted during oauth if I'm using Chrome or Firefox. However, it does not seems to work in IE or in the Android browser. When I say it doesn't work in IE and Android browser, what I mean is that after calling FB.logout subsequent redirects to www.facebook.com/dialog/oauth.. load my callback page without prompting the user to enter credentials again. In Chrome and Firefox, they are 'correctly' prompted to do so at that point.

My various attempts to debug has led me to realize that calls to FB.getLoginStatus (even after calling FB.logout) will pass a valid response.session object to its callback in every browser. So, according to FB.getLoginStatus, the session is still active in every browser even after FB.logout. This makes me wonder my FB.logout works at all.

I know that oauth and the FB JDK are two different things and are not necessarily meant to play together nicely but I haven't seen any other alternatives to ending an FB oauth session, aside from calling FB.logout.

Anybody else seen these irregularities or have a solution? Thanks.

Answer 1

I found this answer after I posted the above:

FB.logout not working in IE8

It recommends putting the redirect after calling FB.logout in a setTimeout function. Basically, give the FB.logout function about 2000 ms to finish.

I tried it, and it fixed the problem in both IE and the Android browser. Basically, Chrome and Firefox have a fast enough JavaScript engine that FB.logout will finish executing before the new page loads in the browser, while IE and Android browser do not.

Following that logic, I realized that there is a reason FB.logout has a callback function and it is probably safer to use that to do any redirects (as opposed to playing with a setTimeout delay).

function mysignout()
{
    FB.logout(function()
    {
        top.location.href = '../mobile.php'
    });
}

Out of curiosity, I tested to see what is the timing difference on executing the callback in Chrome vs. IE. Chrome took 2511 ms to complete the logout IE took 3517 ms. I think what confused me is that I figured FB.logout just deleted the cookie locally and would take no time at all. Instead, it looks like it is some kind of ajax call to revoke authentication on the server and it takes a considerable bit of time.

Answer 2

Michael

Using your method you need to append a user access_token to your logout link. OR

Using the Login buttons auto logout link feature. autologoutlink='true'

<div id="fb-root"></div>
<script>
      window.fbAsyncInit = function() {
        FB.init({
    appId  : '135669679827333',
    status : true, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    xfbml  : true, // parse XFBML
    //channelUrl : 'http://WWW.MYDOMAIN.COM/channel.html', // channel.html file
    oauth  : true // enable OAuth 2.0
        }); 
        // redirect user on login   
        FB.Event.subscribe('auth.login', function(response) {
        top.location.href = 'http://example.com/loggedin/';
        });
        // redirect user on logout.
        FB.Event.subscribe('auth.logout', function(response) {
        top.location.href = "http://example.com/loggedout/";
        });
      };
      (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>
<fb:login-button autologoutlink='true' scope='email,publish_stream'></fb:login-button>

Answer 3

If you don't want to redirect the user after logout, or if you want to get sure, that the FB Session is clear on the client side, you can cleanup manually with these three commands:

FB._authResponse = null;
FB._userStatus = null;
document.cookie = 'fbsr_' + FB._apiKey + '=;'; // clear the facebook cookie

They can even be executed without FB.logout(), but in this case, the user is not logged out from facebook, so after a refresh, he will be logged in again.