กระบวนการอนุญาต OAuth 2.0 ที่ Facebook ใช้คือ "Authorization Code Grant" มาดูวิธีการใช้งานและวิธีการแก้ไขข้อบกพร่องใน Apidog กัน
OAuth 2.0 คืออะไร
OAuth 2.0 เป็นโปรโตคอลการอนุญาตที่ใช้กันอย่างแพร่หลาย ซึ่งช่วยให้บุคคลที่สามเข้าถึงทรัพยากรที่ได้รับการป้องกันได้โดยไม่ต้องใช้ข้อมูลประจำตัวของผู้ใช้ ซึ่งเกี่ยวข้องกับบทบาทหลักสี่ประการ:
- Resource Owner: โดยทั่วไปคือผู้ใช้ที่เป็นเจ้าของทรัพยากรที่ได้รับการป้องกัน
- Client: แอปพลิเคชันของบุคคลที่สามที่ต้องการเข้าถึงข้อมูลของเจ้าของทรัพยากร
- Authorization Server: ตรวจสอบความถูกต้องของเจ้าของทรัพยากรและให้สิทธิ์แก่ไคลเอนต์
- Resource Server: จัดเก็บและจัดการทรัพยากรที่ได้รับการป้องกัน โดยมี API สำหรับการเข้าถึง
ขั้นตอนการอนุญาตทั่วไป
โปรโตคอล OAuth 2.0 ใช้การอนุญาตผ่านขั้นตอนการอนุญาตต่างๆ ขั้นตอนการอนุญาตทั่วไป ได้แก่:
- Authorization Code Grant: ไคลเอนต์เปลี่ยนเส้นทางผู้ใช้ไปยังเซิร์ฟเวอร์การอนุญาต หลังจากที่ผู้ใช้เข้าสู่ระบบและให้สิทธิ์แล้ว เซิร์ฟเวอร์การอนุญาตจะส่งคืนรหัสการอนุญาตไปยังไคลเอนต์ จากนั้นไคลเอนต์จะแลกเปลี่ยนรหัสการอนุญาตพร้อมกับข้อมูลประจำตัวสำหรับโทเค็นการเข้าถึง
- Authorization Code Grant with PKCE (Proof Key for Code Exchange): คล้ายกับขั้นตอนการอนุญาตโค้ดมาตรฐาน แต่ไคลเอนต์จะเพิ่มความปลอดภัยโดยใช้ PKCE (Proof Key for Code Exchange)
- Resource Owner Password Credentials Grant: เจ้าของทรัพยากรให้ชื่อผู้ใช้และรหัสผ่านโดยตรงแก่ไคลเอนต์ จากนั้นไคลเอนต์จะใช้ข้อมูลประจำตัวเหล่านี้เพื่อขอโทเค็นการเข้าถึงจากเซิร์ฟเวอร์การอนุญาต
- Client Credentials Grant: ไคลเอนต์ขอโทเค็นการเข้าถึงโดยตรงจากเซิร์ฟเวอร์การอนุญาตโดยใช้ข้อมูลประจำตัวของตนเอง ขั้นตอนนี้เหมาะสำหรับกรณีที่ไคลเอนต์ต้องการเข้าถึงทรัพยากร
- Implicit Grant: ใช้เพื่อรับโทเค็นการเข้าถึงโดยตรงจากไคลเอนต์ในแอปพลิเคชันบนเบราว์เซอร์ ขั้นตอนนี้มักใช้สำหรับแอปพลิเคชันส่วนหน้าเว็บ
วิธีใช้ Facebook OAuth 2.0 เพื่อเข้าสู่ระบบเว็บไซต์ของบุคคลที่สาม
ขั้นตอนที่ 1: สร้างแอปและรับ Client ID และ Client Secret
ขั้นแรก คุณต้องเปิดบัญชีนักพัฒนา Facebook ที่ https://developers.facebook.com หลังจากเปิดแล้ว ให้สร้างแอปพลิเคชันในนั้น
หลังจากสร้างแอปพลิเคชันสำเร็จแล้ว ให้คลิกตัวเลือก [Application Settings->Basic] หมายเลขแอปพลิเคชันที่นี่คือ Client ID (Client ID) และคีย์แอปพลิเคชันคือ Client Secret (Client Secret) เราจะต้องมีแอตทริบิวต์สองรายการนี้ในภายหลัง ใช้แล้ว
ขั้นตอนที่ 2: กำหนดค่าที่อยู่เรียกกลับ
หลังจากสร้างแอปพลิเคชันแล้ว คุณยังต้องตั้งค่า "ที่อยู่เรียกกลับ" ในแผงควบคุม คลิกตัวเลือก [Control Panel -> Customize this application] จากนั้นคลิก "Facebook Login Settings" เพื่อเข้าสู่อินเทอร์เฟซการกำหนดค่า
ในรายการ "Valid OAuth Jump URI" บนอินเทอร์เฟซการกำหนดค่า ให้กรอกที่อยู่เรียกกลับ (Callback URL) ซึ่งเป็นที่อยู่เปลี่ยนเส้นทาง โดยปกติจะเป็นชื่อโดเมนของเซิร์ฟเวอร์ของคุณ (Facebook กำหนดให้เริ่มต้นด้วย https)
หากคุณยังไม่มี คุณสามารถกรอกข้อมูลลงไปก่อนได้ ตราบใดที่คุณตรวจสอบให้แน่ใจว่าสามารถเข้าถึงชื่อโดเมนได้ หลังจากกำหนดค่าเสร็จแล้ว ให้บันทึก
วัตถุประสงค์ที่เราต้องการ "ที่อยู่เรียกกลับ" คือการรับรหัสการอนุญาต (code) บนแถบที่อยู่ โดยทั่วไป หลังจากกรอกชื่อผู้ใช้และรหัสผ่านในหน้าเข้าสู่ระบบ OAuth 2.0 แล้ว ระบบจะเปลี่ยนเส้นทางไปยัง "ที่อยู่เรียกกลับ" และสามารถแสดงในแถบที่อยู่ได้
รับรหัสการอนุญาต (code) แถบที่อยู่ต่อไปนี้ใช้เพื่อรับค่าโค้ดด้วยตนเอง:
หลังจากกำหนดค่าข้อมูลข้างต้นแล้ว เราจะเข้าสู่กระบวนการหลักของการอนุญาต OAuth 2.0 อย่างเป็นทางการ
ขั้นตอนที่ 3: รับ access token
เมื่อขั้นตอนแรกและขั้นตอนที่สองข้างต้นพร้อมแล้ว เราสามารถขอ access token (Token) ได้ เราจะสาธิตขั้นตอนนี้ผ่าน Apidog
Apidog เป็นเครื่องมือแก้ไขข้อบกพร่องและการจัดการ API ที่ยอดเยี่ยมมาก คุณสามารถรับ access token Token ได้โดยตรงใน Apidog หากคุณยังไม่ได้ติดตั้ง Apidog ให้ไปดาวน์โหลดเลย!
- สร้างคำขอ HTTP หลังจากสร้างโปรเจกต์ HTTP ใน Apidog แล้ว ให้เปิด จากนั้นสร้างคำขอในโปรเจกต์ เลือกตัวเลือก "Edit Document -> Auth -> OAuth 2.0"
2. กำหนดค่า Client ID, Client Secret และ Callback URL โหมดการอนุญาตเริ่มต้นที่เลือกในหน้า OAuth 2.0 ใน Apidog คือ Authorization Code เนื่องจาก Facebook OAuth 2.0 ยังใช้ Authorization Code ดังนั้น คุณจึงไม่จำเป็นต้องสลับที่นี่
ถัดไป ค้นหา Client ID และ Callback URL ที่ด้านล่างของหน้า แล้วกรอก Client ID, Client Secret และ Callback URL ที่กำหนดค่าไว้จากบริการ Facebook OAuth 2.0 พารามิเตอร์เฉพาะคือการกำหนดค่าที่กล่าวถึงใน "ขั้นตอนที่ 1, ขั้นตอนที่ 2" ด้านบน
3. กำหนดค่า Authorization Code Request URL ตามเอกสารอย่างเป็นทางการของ Facebook ในระหว่างการตรวจสอบสิทธิ์ OAuth 2.0 URL คำขอรหัสการอนุญาตคือ: https://www.facebook.com/v19.0/dialog/oauth
เพียงกรอก URL คำขอรหัสการอนุญาตนี้ลงใน Auth URL URL นี้สามารถเข้าใจได้ว่าเป็นหน้าการอนุญาตการเข้าสู่ระบบ มันจะเปิดหน้านี้ (ในรูปแบบของหน้าต่างบนฝั่งไคลเอนต์) เมื่อตรวจสอบสถานะการเข้าสู่ระบบเป็นครั้งแรก โดยแจ้งให้คุณป้อนชื่อผู้ใช้และรหัสผ่านของคุณ
โดยปกติ เมื่อสร้างหน้าการอนุญาตการเข้าสู่ระบบด้วยตนเอง จะต้องมีพารามิเตอร์เพิ่มเติมใน URL การอนุญาต เช่น:
https://www.facebook.com/v19.0/dialog/oauth?
client_id={app-id}
&redirect_uri={redirect-uri}
&state={state-param}
หมายเหตุ: การดำเนินการต่อพารามิเตอร์ไม่ควรมีตัวแบ่งบรรทัดตามปกติ
อย่างไรก็ตาม ใน Apidog โดยทั่วไปไม่จำเป็นต้องมีพารามิเตอร์เพิ่มเติมหลังจาก URL พื้นฐาน จำเป็นต้องมีเฉพาะเส้นทางก่อนเครื่องหมายคำถาม "?" เท่านั้น เนื่องจากพารามิเตอร์บังคับอื่นๆ ได้รับการกำหนดค่าแยกต่างหากในตัวเลือกอื่นๆ แน่นอน หากคุณต้องการรวมพารามิเตอร์แบบสอบถามบางรายการ คุณยังสามารถเพิ่มได้โดยคลิกที่ไอคอนถัดจากช่องป้อนข้อมูลนี้:
เรายังสามารถขยายตัวเลือก "เพิ่มเติม" และกรอกค่าสำหรับพารามิเตอร์ที่ต้องกรอก เช่น การกรอก "Scope" ด้วยสิทธิ์ที่จำเป็น "public_profile" สิทธิ์ "public_profile" ใน Facebook ช่วยให้แอปพลิเคชันสามารถอ่านฟิลด์โปรไฟล์สาธารณะเริ่มต้นของโหนดผู้ใช้ได้ และสิทธิ์นี้จะได้รับอนุญาตโดยอัตโนมัติสำหรับแอปพลิเคชันทั้งหมด
ในตัวเลือก "State" ให้กรอก "state" ซึ่งเป็นการป้องกันการปลอมแปลงคำขอข้ามไซต์ โดยปกติแพลตฟอร์มของบุคคลที่สามจะต้องกรอกสิ่งนี้ ดังนั้นเราจึงกรอกโดยทั่วไป มิฉะนั้น อาจมีข้อผิดพลาดเมื่อรับ access token
4. กำหนดค่า Access Token Request URL ตามเอกสารอย่างเป็นทางการของ Facebook ในการรับ access token URL ที่ร้องขอคือ: https://graph.facebook.com/v19.0/oauth/access_token
เพียงกรอกที่อยู่นี้ลงในช่องป้อนข้อมูล Access Token URL ในทำนองเดียวกัน พารามิเตอร์อื่นๆ ได้รับการกำหนดค่าแยกต่างหากในช่องป้อนข้อมูลอื่นๆ ดังนั้นจึงไม่จำเป็นต้องรวมไว้ใน URL
5. รับ Access Token เมื่อตั้งค่ารายการการกำหนดค่าทั้งหมดข้างต้นแล้ว คุณสามารถคลิกปุ่ม "Get Token" เพื่อรับ access token
หลังจากคลิก หากเป็นการเข้าสู่ระบบครั้งแรกของคุณ หน้าต่างจะปรากฏขึ้นเพื่อขออนุญาต ซึ่งคุณต้องป้อนชื่อผู้ใช้และรหัสผ่านบัญชี Facebook ของคุณ หากคุณกำลังเข้าสู่ระบบจากอุปกรณ์ใหม่ คุณอาจต้องใช้อีเมลของคุณสำหรับการตรวจสอบเพิ่มเติม
หลังจากป้อนชื่อผู้ใช้และรหัสผ่านของคุณ คุณจะได้รับแจ้งให้ยืนยันการอนุญาต
คลิกยืนยันเพื่อทำการอนุญาตให้เสร็จสิ้น เมื่อได้รับอนุญาตแล้ว access token จะได้รับและแสดงบนหน้าโดยอัตโนมัติ ในเวลาเดียวกัน ข้อมูลอื่นๆ ที่ Facebook ส่งคืนก็จะถูกแยกวิเคราะห์ด้วย
ขั้นตอนที่ 4: เข้าถึงทรัพยากรแบบเปิดตาม Token ด้วย access token (Token) ตอนนี้คุณสามารถใช้เพื่อเข้าถึงทรัพยากรแบบเปิดของ Facebook ได้ คุณสามารถดูได้ว่าทรัพยากรแบบเปิดประเภทใดบ้างที่มีอยู่ใน Facebook Graph API
ตัวอย่างเช่น API ต่อไปนี้จะดึง ID และชื่อของผู้ใช้ หากอินเทอร์เฟซของคุณไม่ส่งคืนอะไรเลย คุณอาจต้องตรวจสอบว่าคุณมีสิทธิ์ที่จำเป็นหรือไม่ ดังที่กล่าวไว้ในส่วนที่ 3 ของ "ขั้นตอนที่ 3" เพียงแค่กำหนดค่าใน Scope https://graph.facebook.com/v12.0/me?fields=id,name
เมื่อส่งคำขอ Apidog จะแนบโทเค็นเข้ากับส่วนหัวการอนุญาตโดยอัตโนมัติและส่งออกไปต่อท้าย "Bearer"
หากคุณต้องการนำโทเค็นใน URL คุณยังสามารถแก้ไข "Add Location" ของโทเค็นในตัวเลือกการกำหนดค่าบนหน้า และเลือก "Query Params"
สรุป
OAuth 2.0 เป็นโปรโตคอลการอนุญาตมาตรฐานแบบเปิดที่ช่วยให้แอปพลิเคชันของบุคคลที่สามเข้าถึงทรัพยากรที่ได้รับการป้องกันได้อย่างปลอดภัย กระบวนการอนุญาตโค้ดการอนุญาตเป็นวิธีการอนุญาตทั่วไปและใช้โดย Facebook
ในระหว่างการใช้งาน คุณต้องสร้างแอปพลิเคชัน กำหนดค่าที่อยู่เรียกกลับ รับ access token และใช้ Apidog สำหรับการแก้ไขข้อบกพร่อง หลังจากได้รับ access token แล้ว คุณสามารถใช้โทเค็นเพื่อเรียกใช้ทรัพยากรแบบเปิดของ Facebook ได้
