Facebook API

Facebook Javascript SDK – Logout

2 Comments
–

 
Update 2012-01-14: For OAuth 2.0 implementation, please refer to the new post.
Facebook Javascript SDK – Logout with OAuth 2.0

Update 2011-12-19: Since Facebook has updated their authentication system and HTTP to OAuth 2.0 and HTTPS. The following example will not work any more. i will update the post later. For more information, you can refer to Jerry Cain – Updated JavaScript SDK and OAuth 2.0 Roadmap

–

 

Add the following Javascript function for Facebook logout.

function logoutFacebook() {
  FB.init({ 
    appId:'<?php print YOUR_APP_ID; ?>', cookie:true, 
    status:true, xfbml:true
  });
  FB.logout(function() {
    // Reload the same page after logout
    window.location.reload();
    // Or uncomment the following line to redirect
    //window.location = "https://ykyuen.wordpress.com";
  });
}


 

Here is a complete example which demonstrate both Facebook login and logout.

<?php

define('YOUR_APP_ID', '<facebook app id>');
define('YOUR_APP_SECRET', 'facebook app secret');

function get_facebook_cookie($app_id, $app_secret) {
  $args = array();
  parse_str(trim($_COOKIE['fbs_' . $app_id], '\\"'), $args);
  ksort($args);
  $payload = '';
  foreach ($args as $key => $value) {
    if ($key != 'sig') {
      $payload .= $key . '=' . $value;
    }
  }
  if (md5($payload . $app_secret) != $args['sig']) {
    return null;
  }
  return $args;
}

$cookie = get_facebook_cookie(YOUR_APP_ID, YOUR_APP_SECRET);
$user = json_decode(file_get_contents('https://graph.facebook.com/me?access_token='.$cookie['access_token']));

?>
<html>
  <head>
    <title>Eureka! - My Facebook Login Page</title>
    <script src="http://connect.facebook.net/en_US/all.js"></script>
    <script type="text/javascript">
        function logoutFacebook() {
          FB.init({ 
            appId:'<?php print YOUR_APP_ID; ?>', cookie:true, 
            status:true, xfbml:true
          });
          FB.logout(function() {
            // Reload the same page after logout
            window.location.reload();
            // Or uncomment the following line to redirect
            //window.location = "https://ykyuen.wordpress.com";
          });
        }
      </script>
  </head>
  <body>
    <div id="fb-root"></div>
    <?php if ($user->id) { ?>
      <p>Welcome <?= $user->name ?></p>
      <p><a href="javascript:logoutFacebook()">Logout</a></p>
    <?php } else { ?>
      <script>
        FB.init({ 
          appId:'<?php print YOUR_APP_ID; ?>', cookie:true, 
          status:true, xfbml:true
        });
        FB.Event.subscribe("auth.login", function(response) {
          // Reload the same page after login
          window.location.reload();
          // Or uncomment the following line to redirect
          //window.location = "https://ykyuen.wordpress.com";
        });
      </script>
      <fb:login-button>Login with Facebook</fb:login-button>
    <?php } ?>
  </body>
</html>

 

Done =)

Reference:

2 thoughts on “Facebook Javascript SDK – Logout”

Leave a comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.