แอปตัวอย่าง OAuth 2.0

Roblox ให้แอปตัวอย่าง Node.js ที่แสดงวิธีการใช้ OAuth 2.0 เพื่อให้ผู้ใช้ล็อกอินเข้าสู่บัญชี Roblox ของตนและส่งข้อความในเกมของตน แอปนี้ใช้ authorization code flow without PKCE และเหมาะสำหรับลูกค้าประเภท Confidential เท่านั้น เช่น เซิร์ฟเวอร์ส่วนตัว

หลังจากดาวน์โหลดไฟล์ .zip ให้ทำการแตกไฟล์ลงในโฟลเดอร์ของตนเอง

ลงทะเบียนแอป

ขั้นตอนแรกในการตั้งค่าแอปคือการ ลงทะเบียนแอปในเว็บไซต์ Roblox และคัดลอก Client ID และ Secret ไว้ในที่ปลอดภัย จากนั้นทำตามขั้นตอนการลงทะเบียนตามปกติด้วยการตั้งค่าเหล่านี้:

1. ภายใต้ Permissions ให้เพิ่มสโคป openid, profile และ universe-messaging-service:publish
2. ภายใต้ Redirect URLs ให้เพิ่ม http://localhost:3000/oauth/callback หากคุณต้องการใช้พอร์ตที่ไม่เป็นค่าเริ่มต้นสำหรับแอปของคุณ ให้ระบุที่นี่

ตั้งค่าตัวแปรสภาพแวดล้อม

แทนที่จะเก็บข้อมูลในโค้ด (ไม่แนะนำ) แอปใช้ตัวแปรสภาพแวดล้อมสำหรับ Client ID และ Secret ของคุณ ขั้นตอนในการเพิ่มตัวแปรสภาพแวดล้อมจะแตกต่างกันไปตามระบบปฏิบัติการ

บน Windows ให้รันคำสั่ง PowerShell ต่อไปนี้:

$env:ROBLOX_CLIENT_ID='your_client_id_here'
$env:ROBLOX_CLIENT_SECRET='your_client_secret_here'
$env:ROBLOX_PORT=3000 # ทางเลือก ค่าเริ่มต้นคือ 3000.

บน Mac และการแจกจ่าย Linux ส่วนใหญ่ ให้รันคำสั่งต่อไปนี้ที่เทอร์มินัล:

export ROBLOX_CLIENT_ID=your_client_id_here
export ROBLOX_CLIENT_SECRET=your_client_secret_here
export ROBLOX_PORT=3000 # ทางเลือก ค่าเริ่มต้นคือ 3000.

หากคุณระบุพอร์ตที่ไม่เป็นค่าเริ่มต้นใน URL เปลี่ยนเส้นทางเมื่อทำการลงทะเบียนแอปของคุณ ให้แน่ใจว่าได้เพิ่มตัวแปร ROBLOX_PORT

ติดตั้งพึ่งพา

แอปมีพึ่งพาไม่กี่รายการ ซึ่งสามารถเห็นได้ใน package.json เพื่อทำการติดตั้งพึ่งพาเหล่านี้ ให้รัน:

npm ci

รันแอป

เพื่อเริ่มแอปให้รัน:

npm start

จากนั้นให้ไปที่ http://localhost:3000 (หรือตามพอร์ตที่ไม่ใช่ค่าเริ่มต้นของคุณ) ในเว็บเบราว์เซอร์

แอปจะเปลี่ยนเส้นทางคุณไปยังหน้าจอล็อกอินของ Roblox ทันที ที่คุณสามารถล็อกอิน ยืนยันสิทธิ์ที่แอปกำลังขอ และคลิก ยืนยันและเข้าถึง

Roblox จะเปลี่ยนเส้นทางกลับไปยัง localhost ซึ่งคุณสามารถเห็นว่าแอปจะแสดงข้อมูลผู้ใช้บางอย่างในระดับขั้นต่ำ ลิงก์กลับไปยังโปรไฟล์ของคุณใน Roblox และฟิลด์ที่คุณสามารถใช้ในการส่งข้อความข้ามเกมของคุณ

เกี่ยวกับแอป

โดยรวมแล้ว index.js จะดำเนินการดังต่อไปนี้:

1. เริ่มเซิร์ฟเวอร์เว็บใหม่โดยใช้ express
2. ดึงการกำหนดค่าของ Roblox OpenID Connect (OIDC) ซึ่งรวมถึงจุดเชื่อมต่อสำหรับการมอบอำนาจ ข้อมูลผู้ใช้ เป็นต้น สำหรับข้อมูลเพิ่มเติมเกี่ยวกับจุดเชื่อมต่อนี้ โปรดดูที่ การพิสูจน์ตัวตน OAuth 2.0
3. สร้างไคลเอนต์ Open ID ใหม่โดยใช้ openid-client และข้อมูลรับรองที่เก็บไว้ของคุณ ไคลเอนต์นี้จะทำให้กระบวนการสร้างและส่งคำขอ HTTP ไปยังจุดเชื่อมต่อ OAuth 2.0 ได้ง่ายขึ้นอย่างมาก
4. กำหนดเส้นทางสำหรับแอป รวมถึงการเปลี่ยนเส้นทางสำหรับการล็อกอินและการออกจากระบบ และการตอบกลับ OAuth 2.0
5. หลังจากทำการล็อกอินสำเร็จ จะเก็บโทเคนต่างๆ เป็นคุกกี้ พร้อมด้วยข้อมูลผู้ใช้บางอย่างในระดับขั้นต่ำที่แสดงเป็น HTML โดยขอความช่วยเหลือจาก getHomeHtml.js