เริ่มใช้ Facebook Login API


หน้าแรก facebook app เริ่มใช้ Facebook Login API
ช่วงนี้ผมมีโอกาสได้ทำงานที่จะต้อง connect Facebook API อยู่ชิ้นนึง เลยจะขอหยิบประเด็นเรื่อง concept สำหรับการทำ Facebook Login ผ่านทาง API สำหรับ web application มาพูดซักหน่อย (อารมณ์จดบันทึกของตัวเองล่ะนะ) *หมายเหตุ* entry นี้เขียนตามความเข้าใจของคนเขียนเอง อาจจะมีข้อมูลที่ผิดพลาดไปบ้าง หรือไม่ครบถ้วนไปบ้าง ต้องขอโทษด้วยครับ :D (จุดประสงค์คืออยากจะเขียนโน๊ตเก็บไว้อ่านทีหลังน่ะแหละ)

(*บทความนี้พูดถึงเฉพาะ web application นะ ไม่ได้รวม Facebook API สำหรับ iOS , Android*)

Login Architecture
ลองไปทำความรู้จักกับโครงสร้าง /สถาปัตยกรรม ระบบ Login ของ Facebook ให้เห็นภาพรวมกันก่อน ที่ http://developers.facebook.com/docs/concepts/login/login-architecture/


จากภาพ จะเห็นว่าการติดต่อกับ Facebook Login API ทำได้ 3 วิธีด้วยกัน คือ "Client-side (JS)" ,"Native-side (iOS ,Android)" ,"Client-side (PHP)" (แบบ Client-side ง่ายสุด เพราะงั้นจะเริ่มที่ตรงนี้ก่อนล่ะ (ฮา))

เริ่มใช้งาน
ก่อนอื่นเลย เราต้องสร้าง Application ที่ใช้สำหรับติดต่อกับเจ้า Facebook API ซะก่อน (app ที่ว่า เป็น application บน facebook) ซึ่ง App ที่ว่านี้จะทำการ generate Access Token ส่งไปยัง API เพื่อใช้ในการติดต่อกับฐานข้อมูลของทาง Facebook อีกที (เข้าไปจัดการที่ http://developers.facebook.com/apps)

Access Token คืออะไร?
Access Token คือชุดตัวอักษรชุดหนึ่งที่ app นั้นๆ(app ที่เรากด accept ในตอนแรกที่เริ่มใช้งาน app ,web app เหล่านั้น) generate ออกมาเพื่อใช้ในการติดต่อกับ Facebook API //ตัวอย่างที่เห็นชัดๆเลยคือ เราสามารถนำ Access Token ไปใช้กับ Graph API ในการดึงข้อมูลบางอย่างที่เราต้องการออกมาได้ เช่น "รายชื่อเพื่อนของเรา" ,"รายชื่อหนังสือที่เราชอบ" ,"รายชื่อกรุ๊ปที่เราอยู่" ฯลฯ (ซึ่งการจะดึงข้อมูลพวกนี้มาได้ เราต้องกำหนด Scope ที่จะดึงข้อมูลมาใช้งานในตอนแรกก่อนที่ผู้ใช้จะ Accept app นั้นๆ)

Access Token ได้มาจากไหน?
Access Token จะได้มาจาก application ที่เราจัดเตรียมไว้ (ได้มาจาก app นะครับ ไม่ใช่ได้มาจาก Facebook API แต่จะมีคำสั่งใน API ตัวนึงที่ใช้ดึง Access Token ที่ app นั้นส่งมา มาใช้งานบนเว็บได้)

Access Token ได้มาตอนไหน?
ก่อนที่เราจะเริ่มเขียน web app ในการติดต่อกับ Facebook เราจะมีการ Include SDK (JS ,PHP) เข้ามาใช้งานก่อน ซึ่งในการ include SDK เราจะต้องใส่ App ID (ได้มาจากตอนสร้าง app) ซึ่งการใส่ App ID ตัวนี้ลงไปในตอนโหลด SDK นี่ล่ะ ทำให้เราจะได้ Access Token มาตั้งแต่ตอนที่เปิด web ขึ้นมาเลย //ตอนที่ยังไม่ได้ Login Facebook จะได้ Access Token รูปแบบหนึ่งมา (ใช้งานไม่ได้) และเมื่อ Login Facebook เรียบร้อย + กดยินยอมใช้งาน app เรียบร้อยแล้วก็จะได้ Access Token ชุดใหม่มาแทน (เอาไปใช้งานได้)

บางคนอาจงงเหมือนผมว่า ในเมื่อเราจะทำ login ผ่าน web ของเรา ทำไมต้องมานั่งสร้าง app บน Facebook ด้วย ไม่ได้จะเขียน app บน Facebook Platform ซะหน่อย //อันนี้ต้องปรับความเข้าใจก่อนว่า ไอ app เกมส์ที่เห็นเกลื่อนๆบน Facebook ความจริงแล้วมันก็ดึงข้อมูลจากหน้าเว็บของเราที่เตรียมไว้นั่นล่ะ (คือ เราไม่ได้พัฒนา app บน Facebook เราพัฒนาบนโฮสเรา แต่ Facebook มาอ่านข้อมูลจากไฟล์ .php บนโฮสเราแล้วเอาไปแสดงบนหน้าเว็บเขาอีกที ซึ่งการทำ web app ก็เหมือนกัน เพียงแค่เราไม่ได้บอกให้ Facebook มาดึงข้อมูลหน้าเว็บเราไปแสดงบน Facebook) เพราะงั้น ไอที่เราเตรียม app บน Facebook นั่นคือการ "ลงทะเบียน" เว็บไซต์ของเราว่า "เออ ตูจะไปใช้ข้อมูลของเอ็งละนะ ช่วยจัดเตรียมพื้นที่ให้หน่อย" พอเราขอไป Facebook ก็จะจัดให้เราโดยการส่ง "App ID" และ "App Secret ID" กลับมาให้เรา เหมือนกับบอกว่า "โอเค ตูเปิดพื้นที่ให้เอ็งเข้ามายืมข้อมูลแล้ว อยากมาเอาอะไรก็เอาไป แต่ต้องแสดงบัตรประจำตัว(App ID) ให้เห็นก่อน" พอ user มาใช้งาน app ของเรา app ของเราก็จะมีหน้าที่เดินไปหาเจ้าหน้าที่ (Facebook) แล้วบอกว่า "เออ กูมาละนะ ID กู xxx (App ID) อยากจะได้ข้อมูลของ "นาย ณัฐนนท์ xxx" หน่อย เจ้าตัวเขายินยอมละ (User ID)" Facebook ก็จะ return ข้อมูลตาม User ID ที่ได้รับไป กลับมาให้เรา เราก็เอาไปใช้งานต่อ แค่นั้น :D

กระบวนการ Authenticate
จากที่พิมพ์มาข้างบนทั้งหมด พอจะสรุปกระบวนการยืนยันตัวตน หรือ Authentication บน Facebook ได้ดังนี้ (สำหรับผู้ใช้ทั่วไป)
1. Login with Facebook
2. Accept application (กดยอมรับการใช้งาน application นั้นๆ)
3. app ทำการ return Access Token กลับมาให้ผู้ใช้ account facebook นั้นๆ
4. Web app ,Application นั้นๆจะนำ Access Token ที่ return กลับมาไปใช้ในการดึงข้อมูลที่เกี่ยวข้องกับเจ้าของ Access Token นั้นๆออกมาตามแต่ที่ระบบจะออกแบบไว้ หรือถ้าให้พูดง่ายๆก็คือ เขียน Code ให้ติดต่อกับ Application ที่เตรียมไว้บน Facebook และหาทางรับค่า Access Token ที่ส่งกลับมา(จาก app) เพื่อที่จะโยนต่อไปที่ API หรือ Graph API แล้วรอ return ค่าที่เรา request ไปกลับมาใช้งานอีกที เป็นอันจบกระบวนการ :D

ขอจบไว้เท่านี้ก่อนละกัน ส่วนเรื่อง Technical เอาไว้มาพูดกันอีกทีนะครับ :D (ขอไปศึกษาเพิ่ม ฮ่าๆๆ)
เอาเป็นว่า เล่าสู่กันฟังไปเรื่อยเปื่อย ถ้าข้อมูลตรงไหนผิด หรือผมเข้าใจตรงไหนผิด วานผู้อ่านช่วยแจ้งกลับมาทีนะครับ จะได้นำไปปรับปรุงครับ : )

title_content:
ช่วงนี้ผมมีโอกาสได้ทำงานที่จะต้อง connect Facebook API อยู่ชิ้นนึง เลยจะขอหยิบประเด็นเรื่อง concept สำหรับการทำ Facebook Login ผ่านทาง API สำหรับ web application มาพูดซักหน่อย (อารมณ์จดบันทึกของตัวเองล่ะนะ) *หมายเหตุ* entry นี้เขียนตามความเข้าใจของคนเขียนเอง อาจจะมีข้อมูลที่ผิดพลาดไปบ้าง หรือไม่ครบถ้วนไปบ้าง ต้องขอโทษด้วยครับ :D (จุดประสงค์คืออยากจะเขียนโน๊ตเก็บไว้อ่านทีหลังน่ะแหละ)

refer http://www.nuttanon.com/me/node/1

ขึ้นไปด้านบน