กำหนด รายละเอียด การใช้งาน facebook login button เพิ่มเติม
หน้าแรก facebook app กำหนด รายละเอียด การใช้งาน facebook login button เพิ่มเติม
การกำหนด permission
เมื่อเราต้องการกำหนด permission เพิ่มเพื่อร้องขอไปยังผู้ใช้ facebook ที่กำลังล็อกอิน ว่า
จะอนุญาต ให้ app id นี้สามารถเข้าไปใช้งานข้อมูลใดๆ บ้างของผู้ที่กำลังล็อกอิน ทำได้โดยการกำหนด
attribute ชื่อ perms เข้าไปใน แท้ก fb:login-button ตัวอย่าง
<fb:login-button perms="email,publish_stream"
onlogin="window.location='index.php'">
</fb:login-button>
จากตัวอย่าง perms="email,publish_stream" คือ ร้องขอไปยังผู้ใช้ facebook ที่กำลังล็อกอิน ว่าต้องการ
ได้รับอนุญาตจากผู้ใช้ ในการเข้าถึงข้อมูลอีเมลล์ และสามารถโพสข้อความไปที่หน้า profile ของผู้ใช้
ข้อมูลอ้างอิง สำหรับการกำหนด permission เพิ่มเติม สามารถเข้าไปดูได้ที่
http://developers.facebook.com/docs/authentication/permissions/
การแสดงรูป และชื่อผู้ล็อกอิน
การแสดงรูป และชื่อผู้ล็อกอิน สามารถกำหนด attribute ชื่อ show-faces
เข้าไปใน แท้ก fb:login-button ตัวอย่าง
แสดงปกติพิมพ์โค้ดนี้?
<fb:login-button perms="email,publish_stream"
show-faces="yes"
onlogin="window.location='index.php'">
</fb:login-button>
การแสดงปุ่ม ล็อกอิน โดยขณะที่ล็อกอินอยู่ ให้แสดงเป็น ปุ่มสำหรับ ล็อกเอาท์ อัตโนมัติ
เราสามารถใช้รูปแบบปุ่ม ล็อกอิน ได้ดังนี้
แสดงปกติพิมพ์โค้ดนี้?
<fb:login-button perms="email,publish_stream"
autologoutlink="true"
onlogin="window.location='index.php'">
</fb:login-button>
ประยุกต์ การสร้างปุ่มล็อกอิน ที่เปลี่ยนเป็นปุ่ม ล็อกเอาท์ อัตโนมัติ เมื่อ ล็อกอิน อยู่
พร้อมแสดงรูปภาพ และชื่อผู้ใช้
แสดงปกติพิมพ์โค้ดนี้?
<div style="width:200px;text-align:center;">
<?php
if(isset($_COOKIE['fbs_xxxxxxxx'])){ /// xxxxxxxx คือ app id เช่น app id = 123456789 ก็จะได้เป็น fbs_123456789
?>
<fb:login-button show-faces="yes"></fb:login-button>
<br />
<br />
<?php } ?>
<fb:login-button
perms="email,read_stream,user_checkins"
autologoutlink="true" onlogin="window.location='facebook_js_sdk_02.php'">
</fb:login-button>
</div>
ตัวอย่างโค้ดทดสอบ ใช้งานร่วม JavaScript SDK
แสดงปกติพิมพ์โค้ดนี้?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<div style="width:200px;text-align:center;">
<?php
if(isset($_COOKIE['fbs_xxxxxxxx'])){ /// xxxxxxxx คือ app id เช่น app id = 123456789 ก็จะได้เป็น fbs_123456789
?>
<fb:login-button show-faces="yes"></fb:login-button>
<br />
<br />
<?php } ?>
<fb:login-button
perms="email,read_stream,user_checkins"
autologoutlink="true" onlogin="window.location='facebook_js_sdk_02.php'">
</fb:login-button>
</div>
<div id="fb-root"></div>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR 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
});
};
(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>
<script type="text/javascript">
$(function(){
// jQuery code
});
</script>
</body>
</html>
ขึ้นไปด้านบน