fb-login-button with listener
HTML
<html>
<head>
<title>My Facebook Login Page with listener</title>
</head>
<body>
<div id="fb-root"></div>
<div class="box">
<div class="info">
This is an example of subscribing to the auth login event
</div>
<div class="fb-login-button">Login with Facebook</div>
</div>
</body>
</html>
CSS
p {margin: 10px;color:#336699;}
.box {float:left; border:1px solid #222; padding:5px; margin: 5px;}
.info {color:#778999;font-style:italic;margin:5px 0;}
JavaScript
window.fbAsyncInit = function() {
FB.init({
appId: '113830492072210',
status: true,
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
// {
// status: "", /* Current status of the session */
// authResponse: { /* Information about the current session */
// userID: "" /* String representing the current user's ID */
// signedRequest: "", /* String with the current signedRequest */
// expiresIn: "", /* UNIX time when the session expires */
// accessToken: "", /* Access token of the user */
// }
// }
alert('event status: ' + response.status);
});
FB.getLoginStatus(function(response) {
// {
// status: 'connected',
// authResponse: {
// accessToken: '...',
// expiresIn:'...',
// signedRequest:'...',
// userID:'...'
// }
// }
alert('getLoginStatus: ' + response.status);
if (response.authResponse) {
var access_token = response.authResponse.accessToken;
alert('Access token yay! ' + access_token);
}
});
};
(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));