วิธีการทำ login แบบนี้เริ่มต้นก็ต้องออกแบบฐานข้อมูลก่อนครับ โดยมี ตาราง open_ids เพิ่มขึ้นมา โดยมีฟิลด์ที่เก็บประมาณนี้
user_id (ของเว็บเราเอง)
service (twitter, facebook, google)
uid (id ของเว็บที่จะเป็นตัว login เรา)
access_token (token ที่ได้รับมาหลังจาก login)
dump (serialize data ทุกอย่างที่ปลายทางคืนมา)
พอมี table นี้แล้ว ทีนี้เราจะทำให้เว็บเรา login กับอะไรก็ได้ ที่เรา implement
Concept ของ facebook, twitter จะเป็นเหมือนกันคือใช้ oAuth แต่ detail ยังมีความต่างกันนิดนึง
Facebook นั้น หลังจากที่เราสร้าง ปุ่ม connect แล้ว เวลากดมันจะเป็น popup (หรือจะทำ direct ก็ได้) พอหลังจากที่เรา login cookie จะถูก sync มาที่ domain เราด้วย (ไปตั้งที่ developer ของ facebook)
พอ user login ผ่านมาได้ เราก็เอามาเช็คใน table open_ids ของเรานี่แหละครับ เพราะเค้าจะคืน uid มา
WHERE service=’twitter’ AND uid='[ค่าที่ได้คืนมา]’
โดยที่เราจะเอาค่า user_id set เข้าไปให้ เหมือนกับ login ตามปกติ เท่านี้ก็เรียบร้อยแล้วครับ
ตัวอย่างโคดที่ผมใช้งาน
next_url = “<?php echo (isset($_GET[‘next_url’])) ? $_GET[‘next_url’] : site_url(‘dashboard’, true); ?>”;
}/** Integrate Facebook Connect **/
window.fbAsyncInit = function() {
FB.init({
appId : ‘<?php echo $appId; ?>’,
session : <?php echo json_encode($session); ?>,
status : true,
cookie : true,
xfbml : true
});
};
(function() {
var e = document.createElement(‘script’);
e.src = document.location.protocol + ‘//connect.facebook.net/en_US/all.js’;
e.async = true;
document.getElementById(‘fb-root’).appendChild(e);
}());
$(‘#fb-login, #fb-signup, #fb-signup-full’).bind(‘click’, function() {
FB.login(handleSessionResponse, { perms: ‘offline_access,email,user_birthday,publish_stream,user_about_me’ });
});
function handleSessionResponse(rs) {
if (rs.session && rs.status == ‘connected’) {
$.get(“<?php echo site_url(‘connect/facebook/action’, true); ?>”, function(uid) {
if (uid) {
location.href = next_url;
} else {
location.href= “<?php echo site_url(‘signup/facebook’, true); ?>”;
}
});
}
}
ส่วน link นี้เป็นส่วนการใช้งาน graph api ที่จะเอาพวกค่าต่างๆ มาเก็บ
http://thinkdiff.net/facebook/php-sdk-graph-api-base-facebook-connect-tutorial/
http://developers.facebook.com/docs/plugins/registration/
http://www.jquerytips.com/blogs/view/1126