การลิงก์บัญชี Google กับ OAuth

ระบบจะลิงก์บัญชีโดยใช้ขั้นตอน โดยนัย และ รหัสการให้สิทธิ์ ของ OAuth 2.0 ซึ่งเป็นมาตรฐานอุตสาหกรรม

บริการของคุณต้องรองรับปลายทาง การให้สิทธิ์ และ การแลกเปลี่ยนโทเค็น ที่เป็นไปตามข้อกำหนดของ OAuth 2.0

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

ในขั้นตอน รหัสการให้สิทธิ์ คุณต้องมีปลายทาง 2 รายการ

  • ปลายทาง การให้สิทธิ์ ซึ่งแสดง UI การลงชื่อเข้าใช้แก่ผู้ใช้ที่ยังไม่ได้ลงชื่อเข้าใช้ นอกจากนี้ ปลายทางการให้สิทธิ์ยังสร้างรหัสการให้สิทธิ์ที่ใช้ได้ในระยะสั้นเพื่อบันทึกความยินยอมของผู้ใช้ในการเข้าถึงที่ขอ

  • ปลายทาง การแลกเปลี่ยนโทเค็น ซึ่งมีหน้าที่รับผิดชอบการแลกเปลี่ยน 2 ประเภท

    1. แลกเปลี่ยนรหัสการให้สิทธิ์เป็นโทเค็นการรีเฟรชที่ใช้ได้นานและโทเค็นเพื่อการเข้าถึงที่ใช้ได้ในระยะสั้น การแลกเปลี่ยนนี้จะเกิดขึ้นเมื่อผู้ใช้ทำตามขั้นตอนการลิงก์บัญชี
    2. แลกเปลี่ยนโทเค็นการรีเฟรชที่ใช้ได้นานเป็นโทเค็นเพื่อการเข้าถึงที่ใช้ได้ในระยะสั้น การแลกเปลี่ยนนี้จะเกิดขึ้นเมื่อ Google ต้องการโทเค็นเพื่อการเข้าถึงใหม่เนื่องจากโทเค็นเดิมหมดอายุ

เลือกขั้นตอน OAuth 2.0

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

หลักเกณฑ์การออกแบบ

ส่วนนี้อธิบายข้อกำหนดและคำแนะนำในการออกแบบสำหรับหน้าจอผู้ใช้ที่คุณโฮสต์สำหรับขั้นตอนการลิงก์ OAuth หลังจากที่แอปของ Google เรียกแล้ว แพลตฟอร์มของคุณจะแสดงหน้าลงชื่อเข้าใช้ Google และหน้าจอขอความยินยอมในการลิงก์บัญชีให้ผู้ใช้ ระบบจะนำผู้ใช้กลับไปที่แอปของ Google หลังจากที่ผู้ใช้ให้ความยินยอมในการลิงก์บัญชี

รูปนี้แสดงขั้นตอนที่ผู้ใช้ต้องทำเพื่อลิงก์บัญชี Google
            กับระบบการตรวจสอบสิทธิ์ของคุณ ภาพหน้าจอแรกแสดง
            การลิงก์ที่ผู้ใช้เริ่มต้นจากแพลตฟอร์มของคุณ รูปภาพที่ 2 แสดงการลงชื่อเข้าใช้ Google ของผู้ใช้ ส่วนรูปภาพที่ 3 แสดงความยินยอมของผู้ใช้และการยืนยันในการลิงก์บัญชี Google กับแอปของคุณ ภาพหน้าจอสุดท้ายแสดงบัญชีผู้ใช้ที่ลิงก์สำเร็จแล้วในแอป Google
รูปที่ 1 หน้าจอลงชื่อเข้าใช้ Google และหน้าจอขอความยินยอมในการลิงก์บัญชีของผู้ใช้

ข้อกำหนด

  1. คุณต้องแจ้งให้ทราบว่าบัญชีของผู้ใช้จะลิงก์กับ Google, ไม่ใช่ ผลิตภัณฑ์ที่เฉพาะเจาะจงของ Google เช่น Google Home หรือ Google Assistant

คำแนะนำ

เราขอแนะนำให้คุณทำดังนี้

  1. แสดงนโยบายความเป็นส่วนตัวของ Google ใส่ลิงก์ไปยัง นโยบายความเป็นส่วนตัวของ Google ในหน้าจอขอความยินยอม

  2. ข้อมูลที่จะแชร์ ใช้ภาษาที่ชัดเจนและกระชับเพื่อบอกผู้ใช้ว่า Google ต้องการข้อมูลใดของผู้ใช้และเพราะเหตุใด

  3. คำกระตุ้นการตัดสินใจที่ชัดเจน ระบุคำกระตุ้นการตัดสินใจที่ชัดเจนในหน้าจอขอความยินยอม เช่น "ยอมรับและลิงก์" เนื่องจากผู้ใช้ต้องเข้าใจว่าตนเองต้องแชร์ข้อมูลใดกับ Google เพื่อลิงก์บัญชี

  4. ความสามารถในการยกเลิก จัดเตรียมวิธีให้ผู้ใช้กลับไปหรือยกเลิกได้หากเลือกที่จะไม่ลิงก์

  5. กระบวนการลงชื่อเข้าใช้ที่ชัดเจน ตรวจสอบว่าผู้ใช้มีวิธีที่ชัดเจนในการลงชื่อเข้าใช้บัญชี Google เช่น ช่องสำหรับชื่อผู้ใช้และรหัสผ่าน หรือ ลงชื่อเข้าใช้ด้วย Google

  6. ความสามารถในการยกเลิกการลิงก์ จัดเตรียมกลไกให้ผู้ใช้ยกเลิกการลิงก์ได้ เช่น URL ไปยังการตั้งค่าบัญชีในแพลตฟอร์มของคุณ หรือคุณจะใส่ ลิงก์ไปยังบัญชี Google ที่ผู้ใช้ จัดการบัญชีที่ลิงก์ได้ก็ได้

  7. ความสามารถในการเปลี่ยนบัญชีผู้ใช้ แนะนำวิธีให้ผู้ใช้เปลี่ยนบัญชี วิธีนี้มีประโยชน์อย่างยิ่งหากผู้ใช้มีแนวโน้มที่จะมีหลายบัญชี

    • หากผู้ใช้ต้องปิดหน้าจอขอความยินยอมเพื่อเปลี่ยนบัญชี ให้ส่งข้อผิดพลาดที่กู้คืนได้ไปยัง Google เพื่อให้ผู้ใช้ลงชื่อเข้าใช้บัญชีที่เลือกด้วย การลิงก์ OAuth และขั้นตอน โดยนัย
  8. ใส่โลโก้ของคุณ แสดงโลโก้บริษัทในหน้าจอขอความยินยอม ใช้หลักเกณฑ์ด้านสไตล์เพื่อวางโลโก้ หากต้องการแสดงโลโก้ของ Google ด้วย โปรดดู โลโก้และเครื่องหมายการค้า

创建项目

如需创建项目以使用账号关联,请执行以下操作:

  1. 前往 Google API 控制台
  2. 点击 Create project
  3. 输入名称或接受生成的建议。
  4. 确认或修改任何剩余字段。
  5. 点击创建

如需查看项目 ID,请执行以下操作:

  1. 前往 Google API 控制台
  2. 在着陆页的表格中找到您的项目。项目 ID 会显示在 ID 列中。

Google 账号关联过程包含一个权限请求页面,该页面会告知用户请求访问其数据的应用、应用请求的数据类型以及适用的条款。您需要先配置 OAuth 权限请求页面,然后才能生成 Google API 客户端 ID。

  1. 打开 Google API 控制台的 OAuth 权限请求页面 页面。
  2. 如果系统提示您选择项目,请选择您刚刚创建的项目。
  3. 在“OAuth 权限请求页面”上,填写表单,然后点击“保存”按钮。

    应用名称 :向用户征求同意的应用的名称。该名称应准确反映您的应用,并且与用户在其他位置看到的应用名称保持一致。应用名称将显示在账号关联权限请求页面上。

    应用徽标:权限请求页面上显示的一张图片,用以让用户认出您的应用。徽标会显示在账号关联权限请求页面和账号设置

    支持邮箱 :用户用于针对其同意问题与您联系的邮箱。

    Google API 的范围 :范围允许您的应用访问用户的私有 Google 数据。对于 Google 账号关联用例,默认范围(邮箱、个人资料、openid)就足够了,您无需添加任何敏感范围。通常,最佳做法是在需要访问权限时逐步请求范围,而不是提前请求。了解详情

    已获授权的网域 :为了保护您和您的用户,Google 只允许使用 OAuth 进行身份验证的应用使用已获授权的网域。您应用的链接必须托管在已获授权的网域上。了解详情

    应用首页链接 :应用的首页。必须托管在已获授权的网域上。

    应用隐私权政策链接 :显示在 Google 账号关联权限请求页面上。必须托管在已获授权的网域上。

    应用服务条款链接(可选) :必须托管在已获授权的网域上。

    图 1. 虚构应用 Tunery 的 Google 账号关联权限请求页面

  4. 查看“验证状态”,如果您的应用需要验证,请点击“提交以进行验证”按钮,提交应用以进行验证。如需了解详情,请参阅 OAuth 验证要求

ติดตั้งใช้งานเซิร์ฟเวอร์ OAuth

n

หากต้องการรองรับโฟลว์ ขั้นตอนการให้สิทธิ์โดยนัย ของ OAuth 2.0 บริการของคุณต้องทำให้ปลายทางการให้สิทธิ์พร้อมใช้งานผ่าน HTTPS ปลายทางนี้มีหน้าที่รับผิดชอบในการตรวจสอบสิทธิ์และ ขอความยินยอมจากผู้ใช้สำหรับการเข้าถึงข้อมูล ปลายทางการให้สิทธิ์ จะแสดง UI การลงชื่อเข้าใช้ต่อผู้ใช้ที่ยังไม่ได้ลงชื่อเข้าใช้และบันทึก ความยินยอมในการเข้าถึงที่ขอ

เมื่อแอปพลิเคชันของ Google ต้องเรียกใช้ API ที่ได้รับอนุญาตของบริการใดบริการหนึ่ง Google จะใช้ปลายทางนี้เพื่อขอสิทธิ์จากผู้ใช้ในการเรียกใช้ API เหล่านี้ในนามของผู้ใช้

การลิงก์บัญชี Google: ขั้นตอน OAuth โดยนัย

แผนภาพลำดับต่อไปนี้แสดงรายละเอียดการโต้ตอบระหว่างผู้ใช้ Google และปลายทางของบริการ

ผู้ใช้ แอป Google / เบราว์เซอร์ ปลายทาง การตรวจสอบสิทธิ์ 1. ผู้ใช้เริ่มการลิงก์ 2. เปลี่ยนเส้นทางไปยังปลายทางการให้สิทธิ์ (GET) client_id, redirect_uri, state, scope 3. แสดงหน้าจอลงชื่อเข้าใช้และความยินยอม 4. ผู้ใช้ตรวจสอบสิทธิ์และให้ความยินยอม 5. เปลี่ยนเส้นทางกลับไปที่ Google พร้อมโทเค็น (GET) access_token, state 6. โทเค็นผู้ใช้ร้านค้า 7. เข้าถึงแหล่งข้อมูลสำหรับผู้ใช้
รูปที่ 1 ลำดับเหตุการณ์ในขั้นตอน OAuth 2.0 แบบโดยนัยสำหรับการลิงก์บัญชี Google

บทบาทและความรับผิดชอบ

ตารางต่อไปนี้จะกำหนดบทบาทและความรับผิดชอบของผู้เกี่ยวข้องใน การลิงก์บัญชี Google (GAL) ที่มีขั้นตอนการให้สิทธิ์ OAuth โดยนัย โปรดทราบว่าใน GAL นั้น Google จะทำหน้าที่เป็นไคลเอ็นต์ OAuth ขณะที่บริการของคุณจะทำหน้าที่เป็นผู้ให้บริการข้อมูลประจำตัว/บริการ

ผู้ดำเนินการ / คอมโพเนนต์ บทบาท GAL หน้าที่รับผิดชอบ
แอป / เซิร์ฟเวอร์ของ Google ไคลเอ็นต์ OAuth เริ่มโฟลว์ รับโทเค็นเพื่อการเข้าถึงโดยใช้การเปลี่ยนเส้นทางของเบราว์เซอร์ และจัดเก็บอย่างปลอดภัยเพื่อเข้าถึง API ของบริการ
ปลายทางการให้สิทธิ์ของคุณ เซิร์ฟเวอร์การให้สิทธิ์ ตรวจสอบสิทธิ์ผู้ใช้ ขอรับความยินยอมจากผู้ใช้ และออกโทเค็นเพื่อการเข้าถึงที่มีอายุยาวนาน ให้กับ Google โดยตรง
URI การเปลี่ยนเส้นทางของ Google ปลายทางการเรียกกลับ รับการเปลี่ยนเส้นทางผู้ใช้จากบริการให้สิทธิ์ของคุณโดยมีค่า access_token และ state ใน URL Fragment

เซสชันขั้นตอนการให้สิทธิ์โดยนัยของ OAuth 2.0 ทั่วไปที่ Google เริ่มต้นจะมีขั้นตอนดังนี้

  1. Google จะเปิดปลายทางการให้สิทธิ์ในเบราว์เซอร์ของผู้ใช้ ผู้ใช้จะลงชื่อเข้าใช้ (หากยังไม่ได้ลงชื่อเข้าใช้) และให้สิทธิ์ Google ในการเข้าถึงข้อมูลด้วย API ของคุณ หากยังไม่ได้ให้สิทธิ์
  2. บริการของคุณจะสร้างโทเค็นเพื่อการเข้าถึงและส่งคืนให้ Google โดยให้เปลี่ยนเส้นทางเบราว์เซอร์ของผู้ใช้กลับไปที่ Google พร้อมแนบโทเค็นเพื่อเข้าถึง ไว้กับคำขอ
  3. Google จะเรียก API ของบริการและแนบโทเค็นเพื่อการเข้าถึงไปกับคำขอแต่ละรายการ บริการของคุณจะยืนยันว่าโทเค็นเพื่อการเข้าถึงให้สิทธิ์ Google ในการเข้าถึง API จากนั้นจึงทำการเรียก API ให้เสร็จสมบูรณ์

จัดการคำขอการให้สิทธิ์

เมื่อแอปพลิเคชันของ Google ต้องการลิงก์บัญชีโดยใช้ขั้นตอนการให้สิทธิ์โดยนัยของ OAuth 2.0 Google จะส่งผู้ใช้ไปยังปลายทางการให้สิทธิ์ของคุณพร้อมคำขอที่มีพารามิเตอร์ต่อไปนี้

พารามิเตอร์ของปลายทางการให้สิทธิ์
client_id รหัสไคลเอ็นต์ที่คุณกำหนดให้กับ Google
redirect_uri URL ที่คุณส่งการตอบกลับคำขอนี้
state ค่าการทำบัญชีที่ส่งกลับไปยัง Google โดยไม่มีการเปลี่ยนแปลงใน URI การเปลี่ยนเส้นทาง
response_type ประเภทของค่าที่จะแสดงในคำตอบ สําหรับขั้นตอนแบบโดยนัยของ OAuth 2.0 ประเภทการตอบกลับจะเป็น token เสมอ
user_locale การตั้งค่าภาษาของบัญชี Google ในรูปแบบ RFC5646 ที่ใช้ในการแปลเนื้อหาเป็นภาษาที่ผู้ใช้ต้องการ

ตัวอย่างเช่น หากปลายทางการให้สิทธิ์ของคุณพร้อมใช้งานที่ https://myservice.example.com/auth คำขออาจมีลักษณะดังนี้

GET https://myservice.example.com/auth?client_id=GOOGLE_CLIENT_ID&redirect_uri=REDIRECT_URI&state=STATE_STRING&response_type=token&user_locale=LOCALE

หากต้องการให้ปลายทางการให้สิทธิ์จัดการคำขอลงชื่อเข้าใช้ ให้ทำตามขั้นตอนต่อไปนี้

  1. ยืนยันค่า client_id และ redirect_uri เพื่อ ป้องกันการให้สิทธิ์เข้าถึงแอปไคลเอ็นต์ที่ไม่ต้องการหรือกำหนดค่าไม่ถูกต้อง

    • ยืนยันว่า client_id ตรงกับรหัสไคลเอ็นต์ที่คุณ กำหนดให้กับ Google
    • ยืนยันว่า URL ที่ระบุโดยredirect_uri พารามิเตอร์มีรูปแบบดังนี้
      https://oauth-redirect.googleusercontent.com/r/YOUR_PROJECT_ID
      https://oauth-redirect-sandbox.googleusercontent.com/r/YOUR_PROJECT_ID
      
  2. ตรวจสอบว่าผู้ใช้ลงชื่อเข้าใช้บริการของคุณหรือไม่ หากผู้ใช้ไม่ได้ลงชื่อเข้าใช้ ให้ดำเนินการขั้นตอนการลงชื่อเข้าใช้หรือลงชื่อสมัครใช้ของบริการให้เสร็จสมบูรณ์

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

  4. ส่งการตอบกลับ HTTP ที่เปลี่ยนเส้นทางเบราว์เซอร์ของผู้ใช้ไปยัง URL ที่ระบุโดยพารามิเตอร์ redirect_uri รวมพารามิเตอร์ต่อไปนี้ทั้งหมด ในส่วนย่อย URL

    • access_token: โทเค็นเพื่อการเข้าถึงที่คุณเพิ่งสร้าง
    • token_type: สตริง bearer
    • state: ค่าสถานะที่ไม่ได้แก้ไขจากคำขอเดิม

    ตัวอย่าง URL ที่ได้มีดังนี้

    https://oauth-redirect.googleusercontent.com/r/YOUR_PROJECT_ID#access_token=ACCESS_TOKEN&token_type=bearer&state=STATE_STRING

ตัวแฮนเดิลการเปลี่ยนเส้นทาง OAuth 2.0 ของ Google จะได้รับโทเค็นเพื่อการเข้าถึงและยืนยันว่าค่า state ไม่มีการเปลี่ยนแปลง หลังจากที่ Google ได้รับโทเค็นเพื่อการเข้าถึงสำหรับบริการของคุณแล้ว Google จะแนบโทเค็นไปกับการเรียก API ของบริการในครั้งต่อๆ ไป

处理 userinfo 请求

userinfo 端点是受 OAuth 2.0 保护的资源,会返回关联用户的声明。实现和托管 userinfo 端点是可选的,但以下用例除外:

从您的令牌端点成功检索到访问令牌后,Google 会向您的 userinfo 端点发送请求,以检索关联用户的基本个人资料信息。

userinfo 端点请求标头
Authorization header Bearer 类型的访问令牌。

例如,如果您的 userinfo 端点可通过 https://myservice.example.com/userinfo 时,请求可能如下所示:

GET /userinfo HTTP/1.1
Host: myservice.example.com
Authorization: Bearer ACCESS_TOKEN

为了让 userinfo 端点能够处理请求,请执行以下步骤:

  1. 从 Authorization 标头中提取访问令牌,并返回与访问令牌相关联的用户的信息。
  2. 如果访问令牌无效,则使用 WWW-Authenticate 响应标头返回 HTTP 401 Unauthorized 错误。下面是一个 userinfo 错误响应示例:
    HTTP/1.1 401 Unauthorized
    WWW-Authenticate: error="invalid_token",
    error_description="The Access Token expired"
    
    如果在关联过程中返回 401 未经授权错误或任何其他失败的错误响应,该错误将无法恢复,检索到的令牌将被舍弃,并且用户必须重新开始关联流程。
  3. 如果访问令牌有效,则返回 HTTPS 正文中包含以下 JSON 对象的 HTTP 200 响应 回答:

    {
    "sub": "USER_UUID",
    "email": "EMAIL_ADDRESS",
    "given_name": "FIRST_NAME",
    "family_name": "LAST_NAME",
    "name": "FULL_NAME",
    "picture": "PROFILE_PICTURE",
    }
    如果您的 userinfo 端点返回 HTTP 200 成功响应,则系统会针对用户的 Google 账号注册检索到的令牌和声明。

    userinfo 端点响应
    sub 系统中用于识别用户的唯一 ID。
    email 用户的电子邮件地址。
    given_name 可选:用户的名字。
    family_name 可选:用户的姓氏。
    name 可选:用户的全名。
    picture 可选:用户的个人资料照片。

การตรวจสอบการติดตั้งใช้งาน

您可以使用 OAuth 2.0 Playground 工具验证您的实现。

在该工具中,执行以下步骤:

  1. 点击配置 以打开“OAuth 2.0 配置”窗口。
  2. OAuth flow(OAuth 流程)字段中,选择 Client-side(客户端)。
  3. OAuth Endpoints 字段中,选择 Custom
  4. 在相应字段中指定您的 OAuth 2.0 端点以及您分配给 Google 的客户端 ID。
  5. 第 1 步部分中,请勿选择任何 Google 范围。请将此字段留空,或输入适用于您服务器的范围(如果您不使用 OAuth 范围,则输入任意字符串)。完成后,点击 Authorize APIs
  6. 第 2 步第 3 步部分中,完成 OAuth 2.0 流程,并验证每个步骤是否按预期运行。

您可以使用 Google 账号关联演示工具验证您的实现。

在该工具中,执行以下步骤:

  1. 点击使用 Google 账号登录按钮。
  2. 选择您要关联的账号。
  3. 输入服务 ID。
  4. (可选)输入您将请求访问的一个或多个范围。
  5. 点击开始演示
  6. 当系统提示时,请确认您可以同意或拒绝关联请求。
  7. 确认您已重定向到相应平台。