window.fbAsyncInit 是 Facebook JS SDK 載入後執行。
FB.getLoginStatus 判斷用戶目前對 App 的狀況。
FB.login 做授權登入。
JS SDK 和 PHP SDK 一起用時, 記得要將 FB.init 的 status 和 cookie 設定為 true。
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP_ID',
channelUrl : '//YOUR_DOMAIN/channel.html',
status : true,
cookie : true,
xfbml : true
});
FB.getLoginStatus(function(response) {
/*
// 已授權
{ "authResponse":
{ "accessToken":"...",
"userID":"...",
"expiresIn":5540,
"signedRequest":"..."
},
"status":"connected"
}
// 登入但未授權
{"authResponse":null,"status":"not_authorized"}
// 沒登入
{"authResponse":null,"status":"unknown"}
*/
if (response.status === 'connected') {
FB.api('/me', function(me_response) {
console.log( me_response );
// id, name, first_name, last_name, link, username, gender, timezone, locale, verified, updated_time
// $("#for_user_info").html( me_response.name + " 您好~");
$("#for_user_info").html( JSON.stringify(me_response));
});
} else if (response.status === 'not_authorized') {
$("#for_user_info").html( "請允許 App 要求！");
doAuthenticateApp();
} else {
$("#for_user_info").html( "請登入 Facebook 並允許 App 要求！");
doAuthenticateApp();
}
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/zh_TW/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function doAuthenticateApp(){
FB.login(loginStatusHandler, {
scope: 'read_stream,publish_stream'
});
}
function loginStatusHandler(response) {
switch( response.status ) {
case "connected": // 已授權
window.location.reload();
break;
case "not_authorized": // 已登入，未授權
break;
case "unknown": // 未登入
default:
}
}
</script>
<div id="for_user_info"></div>
<button onclick="doAuthenticateApp()">doAuthenticateApp</button>
</body>
</html>
沒有留言:
張貼留言