เอกสารนี้อธิบายวิธีใช้การให้สิทธิ์ OAuth 2.0 เพื่อเข้าถึง Google APIs จากเว็บแอปพลิเคชัน JavaScript OAuth 2.0 อนุญาตให้ผู้ใช้แชร์ข้อมูลบางอย่างกับแอปพลิเคชันโดยที่ยังเก็บชื่อผู้ใช้ รหัสผ่าน และข้อมูลอื่นๆ ไว้เป็นส่วนตัว ตัวอย่างเช่น แอปพลิเคชันสามารถใช้ OAuth 2.0 เพื่อขอสิทธิ์จากผู้ใช้ในการจัดเก็บไฟล์ใน Google ไดรฟ์
ขั้นตอน OAuth 2.0 นี้เรียกว่าขั้นตอนการให้สิทธิ์โดยนัย โดยออกแบบมาสำหรับแอปพลิเคชันที่เข้าถึง API เฉพาะเมื่อผู้ใช้อยู่ในแอปพลิเคชันเท่านั้น แอปพลิเคชันเหล่านี้ไม่สามารถจัดเก็บข้อมูลลับได้
ในขั้นตอนนี้ แอปจะเปิด URL ของ Google ที่ใช้พารามิเตอร์การค้นหาเพื่อระบุแอปและประเภทการเข้าถึง API ที่แอปต้องการ คุณสามารถเปิด URL ในหน้าต่างเบราว์เซอร์ปัจจุบันหรือกล่องโต้ตอบได้ ผู้ใช้สามารถตรวจสอบสิทธิ์กับ Google และให้สิทธิ์ที่ขอได้ จากนั้น Google จะเปลี่ยนเส้นทางผู้ใช้กลับไปยังแอปของคุณ การเปลี่ยนเส้นทางนี้มีโทเค็นเพื่อการเข้าถึง ซึ่งแอปจะยืนยันแล้วใช้เพื่อส่งคำขอ API
ไลบรารีของไคลเอ็นต์ Google APIs และ Google Identity Services
หากใช้ไลบรารีของไคลเอ็นต์ Google APIs สำหรับ JavaScript เพื่อทำการเรียกที่ได้รับสิทธิ์ไปยัง Google คุณควรใช้ไลบรารี JavaScript ของ Google Identity Services เพื่อจัดการขั้นตอนการให้สิทธิ์ เราขอแนะนำอย่างยิ่งให้ใช้โมเดลโค้ดของ Google Identity Services ซึ่งอิงตามขั้นตอนรหัสการให้สิทธิ์ที่ปลอดภัยยิ่งขึ้นด้วย PKCE
ข้อกำหนดเบื้องต้น
เปิดใช้ API สำหรับโปรเจ็กต์
แอปพลิเคชันที่เรียกใช้ Google API จะต้องเปิดใช้ API เหล่านั้นในคอนโซล API
วิธีเปิดใช้ API สำหรับโปรเจ็กต์
- เปิดคลัง API ในคอนโซล Google API
- หากได้รับข้อความแจ้ง ให้เลือกโปรเจ็กต์หรือสร้างโปรเจ็กต์ใหม่
- ไลบรารี API จะแสดง API ทั้งหมดที่มีอยู่ โดยจัดกลุ่มตามตระกูลผลิตภัณฑ์และความนิยม หาก API ที่ต้องการเปิดใช้ไม่ปรากฏในรายการ ให้ใช้การค้นหาเพื่อค้นหา API หรือคลิกดูทั้งหมดในกลุ่มผลิตภัณฑ์ที่ API นั้นอยู่
- เลือก API ที่ต้องการเปิดใช้ แล้วคลิกปุ่มเปิดใช้
- เปิดใช้การเรียกเก็บเงินเมื่อได้รับข้อความแจ้ง
- หากได้รับข้อความแจ้ง ให้อ่านและยอมรับข้อกำหนดในการให้บริการของ API
สร้างข้อมูลเข้าสู่ระบบสำหรับการให้สิทธิ์
แอปพลิเคชันที่ใช้ OAuth 2.0 เพื่อเข้าถึง Google APIs ต้องมีข้อมูลเข้าสู่ระบบการให้สิทธิ์ที่ระบุแอปพลิเคชันไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google ขั้นตอนต่อไปนี้จะอธิบายวิธีสร้างข้อมูลเข้าสู่ระบบสำหรับโปรเจ็กต์ จากนั้นแอปพลิเคชันจะใช้ข้อมูลเข้าสู่ระบบเพื่อเข้าถึง API ที่คุณเปิดใช้สำหรับโปรเจ็กต์นั้นได้
- ไปที่หน้าลูกค้า
- คลิกสร้างไคลเอ็นต์
- เลือกประเภทแอปพลิเคชันเป็นเว็บแอปพลิเคชัน
- กรอกข้อมูลในแบบฟอร์มให้ครบถ้วน แอปพลิเคชันที่ใช้ JavaScript เพื่อส่งคำขอ Google API ที่ได้รับอนุญาตต้องระบุต้นทาง JavaScript ที่ได้รับอนุญาต ต้นทางจะระบุโดเมนที่แอปพลิเคชันของคุณสามารถส่งคำขอไปยังเซิร์ฟเวอร์ OAuth 2.0 ได้ ต้นทางเหล่านี้ต้องเป็นไปตามกฎการตรวจสอบของ Google
ระบุขอบเขตการเข้าถึง
ขอบเขตช่วยให้แอปพลิเคชันขอสิทธิ์เข้าถึงเฉพาะทรัพยากรที่จำเป็นเท่านั้น และยังช่วยให้ผู้ใช้ควบคุมปริมาณการเข้าถึงที่ให้แก่แอปพลิเคชันของคุณได้ด้วย ดังนั้น จำนวนขอบเขตที่ขอและความเป็นไปได้ที่จะได้รับความยินยอมจากผู้ใช้อาจมีความสัมพันธ์แบบผกผันกัน
ก่อนเริ่มใช้การให้สิทธิ์ OAuth 2.0 เราขอแนะนำให้คุณระบุขอบเขตที่แอปจะต้องได้รับสิทธิ์เข้าถึง
เอกสารขอบเขต OAuth 2.0 API มีรายการขอบเขตทั้งหมดที่คุณอาจใช้เพื่อเข้าถึง Google APIs
การรับโทเค็นเพื่อการเข้าถึง OAuth 2.0
ขั้นตอนต่อไปนี้แสดงวิธีที่แอปพลิเคชันโต้ตอบกับเซิร์ฟเวอร์ OAuth 2.0 ของ Google เพื่อขอความยินยอมจากผู้ใช้ในการส่งคำขอ API ในนามของผู้ใช้ แอปพลิเคชันของคุณต้องได้รับความยินยอมดังกล่าวก่อนจึงจะดำเนินการตามคำขอ Google API ที่ต้องมีการให้สิทธิ์จากผู้ใช้ได้
ขั้นตอนที่ 1: เปลี่ยนเส้นทางไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google
หากต้องการขอสิทธิ์เข้าถึงข้อมูลของผู้ใช้ ให้เปลี่ยนเส้นทางผู้ใช้ไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google
ปลายทางของ OAuth 2.0
สร้าง URL เพื่อขอสิทธิ์เข้าถึงจากปลายทาง OAuth 2.0 ของ Google ที่ https://accounts.google.com/o/oauth2/v2/auth ปลายทางนี้เข้าถึงได้ผ่าน HTTPS โดยระบบจะปฏิเสธการเชื่อมต่อ HTTP ธรรมดา
เซิร์ฟเวอร์การให้สิทธิ์ของ Google รองรับพารามิเตอร์สตริงการค้นหาต่อไปนี้สำหรับแอปพลิเคชันเว็บเซิร์ฟเวอร์
| พารามิเตอร์ | |||||||
|---|---|---|---|---|---|---|---|
client_id |
จำเป็น
รหัสไคลเอ็นต์สำหรับแอปพลิเคชันของคุณ คุณดูค่านี้ได้ในหน้าไคลเอ็นต์ของคอนโซล Cloud |
||||||
redirect_uri |
จำเป็น
กำหนดตำแหน่งที่เซิร์ฟเวอร์ API จะเปลี่ยนเส้นทางผู้ใช้หลังจากที่ผู้ใช้ทำขั้นตอนการให้สิทธิ์เสร็จสมบูรณ์ ค่าต้องตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตรายการใดรายการหนึ่งสำหรับไคลเอ็นต์ OAuth 2.0 ซึ่งคุณกำหนดค่าไว้ในหน้าไคลเอ็นต์ของ Cloud Console ของไคลเอ็นต์ หากค่านี้ไม่ตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตสำหรับ โปรดทราบว่ารูปแบบ |
||||||
response_type |
จำเป็น
แอปพลิเคชัน JavaScript ต้องตั้งค่าพารามิเตอร์เป็น |
||||||
scope |
จำเป็น
รายการขอบเขตที่คั่นด้วยช่องว่างซึ่งระบุทรัพยากรที่แอปพลิเคชันของคุณสามารถเข้าถึงในนามของผู้ใช้ ค่าเหล่านี้จะแจ้งหน้าจอขอความยินยอมที่ Google แสดงต่อผู้ใช้ ขอบเขตช่วยให้แอปพลิเคชันขอสิทธิ์เข้าถึงเฉพาะทรัพยากรที่จำเป็นเท่านั้น และยังช่วยให้ผู้ใช้ควบคุมปริมาณสิทธิ์เข้าถึงที่ให้แก่แอปพลิเคชันของคุณได้ด้วย ดังนั้นจึงมีความสัมพันธ์แบบผกผันระหว่างจำนวนขอบเขตที่ขอและแนวโน้มที่จะได้รับความยินยอมของผู้ใช้ เราขอแนะนำให้แอปพลิเคชันของคุณขอสิทธิ์เข้าถึงขอบเขตการให้สิทธิ์ในบริบทเมื่อเป็นไปได้ การขอสิทธิ์เข้าถึงข้อมูลผู้ใช้ในบริบทโดยใช้การให้สิทธิ์แบบเพิ่มขึ้นจะช่วยให้ผู้ใช้เข้าใจว่าเหตุใดแอปพลิเคชันจึงต้องมีสิทธิ์เข้าถึงตามที่ขอ |
||||||
state |
แนะนำ
ระบุค่าสตริงที่แอปพลิเคชันใช้เพื่อรักษาสถานะระหว่างคำขอการให้สิทธิ์และการตอบกลับของเซิร์ฟเวอร์การให้สิทธิ์
เซิร์ฟเวอร์จะแสดงผลค่าที่ตรงกันทุกประการกับค่าที่คุณส่งเป็นคู่ คุณใช้พารามิเตอร์นี้ได้หลายวัตถุประสงค์ เช่น การนำผู้ใช้ไปยังแหล่งข้อมูลที่ถูกต้องในแอปพลิเคชัน การส่ง Nonce และการลดการปลอมแปลงคำขอแบบข้ามเว็บไซต์ เนื่องจาก |
||||||
include_granted_scopes |
ไม่บังคับ
ช่วยให้แอปพลิเคชันใช้การให้สิทธิ์แบบเพิ่มทีละส่วนเพื่อขอสิทธิ์เข้าถึงขอบเขตเพิ่มเติมในบริบทได้ หากคุณตั้งค่าพารามิเตอร์นี้เป็น |
||||||
enable_granular_consent |
ไม่บังคับ
ค่าเริ่มต้นคือ เมื่อ Google เปิดใช้สิทธิ์แบบละเอียดสำหรับแอปพลิเคชัน พารามิเตอร์นี้จะไม่มีผลอีกต่อไป |
||||||
login_hint |
ไม่บังคับ
หากแอปพลิเคชันทราบว่าผู้ใช้รายใดพยายามตรวจสอบสิทธิ์ ก็สามารถใช้พารามิเตอร์นี้เพื่อระบุคำแนะนำแก่เซิร์ฟเวอร์การตรวจสอบสิทธิ์ของ Google ได้ เซิร์ฟเวอร์จะใช้คำแนะนำเพื่อลดความซับซ้อนของขั้นตอนการเข้าสู่ระบบโดยการป้อนข้อมูลในช่องอีเมลล่วงหน้าในแบบฟอร์มการลงชื่อเข้าใช้ หรือโดยการเลือกเซสชันการเข้าสู่ระบบหลายเซสชันที่เหมาะสม ตั้งค่าพารามิเตอร์เป็นอีเมลหรือตัวระบุ |
||||||
prompt |
ไม่บังคับ
รายการข้อความแจ้งที่คั่นด้วยเว้นวรรคและคำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่เพื่อแสดงต่อผู้ใช้ หากคุณไม่ระบุพารามิเตอร์นี้ ระบบจะแจ้งให้ผู้ใช้ทราบเฉพาะในครั้งแรกที่โปรเจ็กต์ของคุณขอสิทธิ์เข้าถึง ดูข้อมูลเพิ่มเติมได้ที่ การแจ้งขอความยินยอมอีกครั้ง ค่าที่เป็นไปได้มีดังนี้
|
||||||
ตัวอย่างการเปลี่ยนเส้นทางไปยังเซิร์ฟเวอร์การให้สิทธิ์ของ Google
ตัวอย่าง URL แสดงอยู่ด้านล่าง โดยมีการขึ้นบรรทัดใหม่และเว้นวรรคเพื่อให้อ่านง่าย
https://accounts.google.com/o/oauth2/v2/auth? scope=https%3A//www.googleapis.com/auth/drive.metadata.readonly%20https%3A//www.googleapis.com/auth/calendar.readonly& include_granted_scopes=true& response_type=token& state=state_parameter_passthrough_value& redirect_uri=https%3A//developers.google.com/oauthplayground& client_id=client_id
หลังจากสร้าง URL คำขอแล้ว ให้เปลี่ยนเส้นทางผู้ใช้ไปยัง URL ดังกล่าว
โค้ดตัวอย่าง JavaScript
ข้อมูลโค้ด JavaScript ต่อไปนี้แสดงวิธีเริ่มขั้นตอนการให้สิทธิ์ใน JavaScript โดยไม่ต้องใช้ไลบรารีของไคลเอ็นต์ Google APIs สำหรับ JavaScript เนื่องจากปลายทาง OAuth 2.0 นี้ไม่รองรับการแชร์ทรัพยากรแบบข้ามต้นทาง (CORS) ข้อมูลโค้ดจึงสร้างแบบฟอร์มที่เปิดคำขอไปยังปลายทางนั้น
/* * Create form to request access token from Google's OAuth 2.0 server. */ function oauthSignIn() { // Google's OAuth 2.0 endpoint for requesting an access token var oauth2Endpoint = 'https://accounts.google.com/o/oauth2/v2/auth'; // Create <form> element to submit parameters to OAuth 2.0 endpoint. var form = document.createElement('form'); form.setAttribute('method', 'GET'); // Send as a GET request. form.setAttribute('action', oauth2Endpoint); // Parameters to pass to OAuth 2.0 endpoint. var params = {'client_id': 'YOUR_CLIENT_ID', 'redirect_uri': 'YOUR_REDIRECT_URI', 'response_type': 'token', 'scope': 'https://www.googleapis.com/auth/drive.metadata.readonly https://www.googleapis.com/auth/calendar.readonly', 'include_granted_scopes': 'true', 'state': 'pass-through value'}; // Add form parameters as hidden input values. for (var p in params) { var input = document.createElement('input'); input.setAttribute('type', 'hidden'); input.setAttribute('name', p); input.setAttribute('value', params[p]); form.appendChild(input); } // Add form to page and submit it to open the OAuth 2.0 endpoint. document.body.appendChild(form); form.submit(); }
ขั้นตอนที่ 2: Google แจ้งผู้ใช้เพื่อขอความยินยอม
ในขั้นตอนนี้ ผู้ใช้จะตัดสินใจว่าจะให้สิทธิ์เข้าถึงที่ขอแก่แอปพลิเคชันของคุณหรือไม่ ในขั้นตอนนี้ Google จะแสดงหน้าต่างขอความยินยอมซึ่งแสดงชื่อแอปพลิเคชันและบริการ Google API ที่ขอสิทธิ์เข้าถึงด้วยข้อมูลเข้าสู่ระบบการให้สิทธิ์ของผู้ใช้ และสรุปขอบเขตของสิทธิ์เข้าถึงที่จะได้รับ จากนั้นผู้ใช้จะให้ความยินยอมในการให้สิทธิ์เข้าถึงขอบเขตอย่างน้อย 1 รายการที่แอปพลิเคชันของคุณขอหรือปฏิเสธคำขอได้
แอปพลิเคชันของคุณไม่จำเป็นต้องดำเนินการใดๆ ในขั้นตอนนี้ เนื่องจากกำลังรอการตอบกลับจากเซิร์ฟเวอร์ OAuth 2.0 ของ Google ที่ระบุว่ามีการให้สิทธิ์เข้าถึงหรือไม่ เราจะอธิบายการตอบกลับดังกล่าวในขั้นตอนถัดไป
ข้อผิดพลาด
คำขอไปยังปลายทางการให้สิทธิ์ OAuth 2.0 ของ Google อาจแสดงข้อความแสดงข้อผิดพลาดต่อผู้ใช้แทนขั้นตอนการตรวจสอบสิทธิ์และการให้สิทธิ์ที่คาดไว้ รหัสข้อผิดพลาดที่พบบ่อยและวิธีแก้ไขที่แนะนำมีดังนี้
admin_policy_enforced
บัญชี Google ไม่สามารถให้สิทธิ์ขอบเขตที่ขออย่างน้อย 1 รายการเนื่องจากนโยบายของผู้ดูแลระบบ Google Workspace ดูบทความช่วยเหลือสำหรับผู้ดูแลระบบ Google Workspace เรื่อง ควบคุมว่าจะให้แอปของบุคคลที่สามและแอปภายในรายการใดเข้าถึงข้อมูล Google Workspace ได้บ้าง เพื่อดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีที่ผู้ดูแลระบบอาจจำกัดการเข้าถึงขอบเขตทั้งหมดหรือขอบเขตที่มีความละเอียดอ่อนและถูกจำกัด จนกว่าจะมีการให้สิทธิ์เข้าถึงรหัสไคลเอ็นต์ OAuth ของคุณอย่างชัดเจน
disallowed_useragent
ปลายทางการให้สิทธิ์จะแสดงภายใน User Agent ที่ฝังไว้ซึ่งไม่ได้รับอนุญาตตามนโยบาย OAuth 2.0 ของ Google
นักพัฒนาแอป iOS และ macOS อาจพบข้อผิดพลาดนี้เมื่อเปิดคำขอการให้สิทธิ์ใน WKWebView
นักพัฒนาแอปควรใช้ไลบรารี iOS เช่น Google Sign-In สำหรับ iOS หรือ AppAuth สำหรับ iOS ของ OpenID Foundation แทน
นักพัฒนาเว็บอาจพบข้อผิดพลาดนี้เมื่อแอป iOS หรือ macOS เปิดเว็บลิงก์ทั่วไปใน User Agent ที่ฝังไว้ และผู้ใช้ไปยังปลายทางการให้สิทธิ์ OAuth 2.0 ของ Google จากเว็บไซต์ของคุณ นักพัฒนาแอปควรอนุญาตให้ลิงก์ทั่วไปเปิดในเครื่องมือจัดการลิงก์เริ่มต้นของระบบปฏิบัติการ ซึ่งรวมถึงทั้งเครื่องมือจัดการ Universal Link หรือแอปเบราว์เซอร์เริ่มต้น ไลบรารี SFSafariViewController ก็เป็นตัวเลือกที่รองรับเช่นกัน
org_internal
รหัสไคลเอ็นต์ OAuth ในคำขอเป็นส่วนหนึ่งของโปรเจ็กต์ที่จำกัดการเข้าถึงบัญชี Google ใน องค์กร Google Cloud ที่เฉพาะเจาะจง ดูข้อมูลเพิ่มเติมเกี่ยวกับตัวเลือกการกำหนดค่านี้ได้ที่ส่วนประเภทผู้ใช้ในบทความช่วยเหลือเรื่องการตั้งค่าหน้าจอขอความยินยอม OAuth
invalid_client
ต้นทางที่ส่งคำขอไม่ได้รับอนุญาตสำหรับไคลเอ็นต์นี้ ดูorigin_mismatch
deleted_client
ไคลเอ็นต์ OAuth ที่ใช้สร้างคำขอถูกลบแล้ว การลบอาจเกิดขึ้นด้วยตนเองหรือโดยอัตโนมัติในกรณีที่ไม่ได้ใช้ไคลเอ็นต์ คุณสามารถกู้คืนลูกค้าที่ลบไปแล้วได้ภายใน 30 วันนับจากวันที่ลบ ดูข้อมูลเพิ่มเติม
invalid_grant
เมื่อใช้การให้สิทธิ์แบบเพิ่มขึ้น โทเค็นอาจหมดอายุหรือใช้ไม่ได้แล้ว ตรวจสอบสิทธิ์ผู้ใช้อีกครั้งและขอความยินยอมของผู้ใช้เพื่อรับโทเค็นใหม่ หากยังคงเห็นข้อผิดพลาดนี้อยู่ ให้ตรวจสอบว่าได้กำหนดค่าแอปพลิเคชันอย่างถูกต้อง และคุณใช้โทเค็นและพารามิเตอร์ที่ถูกต้องในคำขอ มิฉะนั้น บัญชีผู้ใช้อาจถูกลบหรือปิดใช้ไปแล้ว
origin_mismatch
รูปแบบ โดเมน และ/หรือพอร์ตของ JavaScript ที่สร้างคำขอการให้สิทธิ์อาจไม่ตรงกับ URI ต้นทางของ JavaScript ที่ได้รับอนุญาตซึ่งลงทะเบียนไว้สำหรับรหัสไคลเอ็นต์ OAuth ตรวจสอบต้นทาง JavaScript ที่ได้รับอนุญาตในหน้าไคลเอ็นต์ของคอนโซล Google Cloud
redirect_uri_mismatch
redirect_uri ที่ส่งในคำขอการให้สิทธิ์ไม่ตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตสำหรับรหัสไคลเอ็นต์ OAuth ตรวจสอบ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตในหน้าไคลเอ็นต์ของคอนโซล Google Cloud
รูปแบบ โดเมน และ/หรือพอร์ตของ JavaScript ที่สร้างคำขอการให้สิทธิ์อาจไม่ตรงกับ URI ต้นทางของ JavaScript ที่ได้รับอนุญาตซึ่งลงทะเบียนไว้สำหรับรหัสไคลเอ็นต์ OAuth ตรวจสอบต้นทาง JavaScript ที่ได้รับอนุญาตในหน้าไคลเอ็นต์ของคอนโซล Google Cloud
พารามิเตอร์ redirect_uri อาจหมายถึงขั้นตอน OAuth นอกแบนด์ (OOB) ที่เลิกใช้งานแล้วและไม่รองรับอีกต่อไป ดูคำแนะนำในการย้ายข้อมูลเพื่ออัปเดตการผสานรวม
invalid_request
เกิดข้อผิดพลาดกับคำขอของคุณ ซึ่งอาจเกิดจากสาเหตุหลายประการดังนี้
- คำขอมีรูปแบบไม่ถูกต้อง
- คำขอไม่มีพารามิเตอร์ที่จำเป็น
- คำขอใช้วิธีการให้สิทธิ์ที่ Google ไม่รองรับ ยืนยันว่าการผสานรวม OAuth ของคุณใช้วิธีการผสานรวมที่แนะนำ
ขั้นตอนที่ 3: จัดการการตอบกลับของเซิร์ฟเวอร์ OAuth 2.0
ปลายทางของ OAuth 2.0
เซิร์ฟเวอร์ OAuth 2.0 จะส่งการตอบกลับไปยัง redirect_uri ที่ระบุไว้ในคำขอโทเค็นเพื่อการเข้าถึง
หากผู้ใช้อนุมัติคำขอ การตอบกลับจะมีโทเค็นเพื่อการเข้าถึง หากผู้ใช้ไม่อนุมัติคำขอ การตอบกลับจะมีข้อความแสดงข้อผิดพลาด ระบบจะแสดงโทเค็นเพื่อการเข้าถึงหรือข้อความแสดงข้อผิดพลาดในส่วนแฮชของ URI การเปลี่ยนเส้นทาง ดังที่แสดงในตัวอย่างต่อไปนี้
การตอบกลับโทเค็นเพื่อการเข้าถึง:
https://oauth2.example.com/callback#access_token=4/P7q7W91&token_type=Bearer&expires_in=3600
นอกจากพารามิเตอร์
access_tokenแล้ว สตริงส่วนย่อยยังมีพารามิเตอร์token_typeซึ่งตั้งค่าเป็นBearerเสมอ และพารามิเตอร์expires_inซึ่งระบุอายุการใช้งานของโทเค็นเป็นวินาที หากมีการระบุพารามิเตอร์stateในคำขอโทเค็นเพื่อการเข้าถึง ค่าของพารามิเตอร์จะรวมอยู่ในการตอบกลับด้วย- การตอบกลับข้อผิดพลาด:
https://oauth2.example.com/callback#error=access_denied
ตัวอย่างการตอบกลับของเซิร์ฟเวอร์ OAuth 2.0
คุณสามารถทดสอบขั้นตอนนี้ได้โดยคลิก URL ตัวอย่างต่อไปนี้ ซึ่งจะขอสิทธิ์เข้าถึงแบบอ่านอย่างเดียวเพื่อดูข้อมูลเมตาของไฟล์ใน Google ไดรฟ์ และสิทธิ์เข้าถึงแบบอ่านอย่างเดียวเพื่อดูกิจกรรมใน Google ปฏิทิน
https://accounts.google.com/o/oauth2/v2/auth? scope=https%3A//www.googleapis.com/auth/drive.metadata.readonly%20https%3A//www.googleapis.com/auth/calendar.readonly& include_granted_scopes=true& response_type=token& state=state_parameter_passthrough_value& redirect_uri=https%3A//developers.google.com/oauthplayground& client_id=client_id
หลังจากทำตามขั้นตอน OAuth 2.0 เสร็จแล้ว เบราว์เซอร์จะเปลี่ยนเส้นทางคุณไปยัง OAuth 2.0 Playground ซึ่งเป็นเครื่องมือสำหรับทดสอบขั้นตอน OAuth คุณจะเห็นว่า OAuth 2.0 Playground ได้บันทึกรหัสการให้สิทธิ์โดยอัตโนมัติ
ขั้นตอนที่ 4: ตรวจสอบขอบเขตที่ผู้ใช้ให้สิทธิ์
เมื่อขอสิทธิ์ (ขอบเขต) หลายรายการ ผู้ใช้อาจไม่ให้สิทธิ์เข้าถึงทั้งหมดแก่แอปของคุณ แอปของคุณต้องยืนยันขอบเขตที่ได้รับสิทธิ์จริงๆ และจัดการสถานการณ์ที่สิทธิ์บางอย่างถูกปฏิเสธอย่างเหมาะสม โดยปกติแล้วจะทำได้ด้วยการปิดใช้ฟีเจอร์ที่อาศัยขอบเขตที่ถูกปฏิเสธเหล่านั้น
แต่ก็มีข้อยกเว้น แอป Google Workspace Enterprise ที่มีการมอบสิทธิ์ทั่วทั้งโดเมนหรือแอปที่ทำเครื่องหมายเป็นเชื่อถือได้จะข้ามหน้าจอขอความยินยอมสำหรับสิทธิ์แบบละเอียด สำหรับแอปเหล่านี้ ผู้ใช้จะไม่เห็นหน้าจอขอความยินยอมสำหรับสิทธิ์แบบละเอียด แต่แอปของคุณจะได้รับขอบเขตที่ขอทั้งหมดหรือไม่มีเลย
ดูข้อมูลโดยละเอียดเพิ่มเติมได้ที่วิธีจัดการสิทธิ์แบบละเอียด
ปลายทางของ OAuth 2.0
หากต้องการตรวจสอบว่าผู้ใช้ได้ให้สิทธิ์เข้าถึงขอบเขตที่เฉพาะเจาะจงแก่แอปพลิเคชันของคุณหรือไม่ ให้ตรวจสอบช่อง scope ในการตอบกลับโทเค็นเพื่อการเข้าถึง ขอบเขตของสิทธิ์เข้าถึงที่ได้รับจากโทเค็นเพื่อการเข้าถึง ซึ่งแสดงเป็นรายการสตริงที่คั่นด้วยเว้นวรรคและคำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่
ตัวอย่างเช่น การตอบกลับโทเค็นเพื่อการเข้าถึงตัวอย่างต่อไปนี้ระบุว่าผู้ใช้ได้ให้สิทธิ์เข้าถึงแอปพลิเคชันของคุณแก่กิจกรรมในไดรฟ์แบบอ่านอย่างเดียวและสิทธิ์กิจกรรมในปฏิทิน
{ "access_token": "1/fFAGRNJru1FTz70BzhT3Zg", "expires_in": 3920, "token_type": "Bearer", "scope": "https://www.googleapis.com/auth/drive.metadata.readonly https://www.googleapis.com/auth/calendar.readonly", "refresh_token": "1//xEoDL4iW3cxlI7yDbSRFYNG01kVKM2C-259HOF2aQbI" }
การเรียก Google API
ปลายทางของ OAuth 2.0
หลังจากที่แอปพลิเคชันได้รับโทเค็นเพื่อการเข้าถึงแล้ว คุณสามารถใช้โทเค็นดังกล่าวเพื่อเรียกใช้ Google API ในนามของบัญชีผู้ใช้ที่ระบุได้ หากได้รับสิทธิ์เข้าถึงตามขอบเขตที่ API กำหนด โดยใส่โทเค็นเพื่อการเข้าถึงในคำขอไปยัง API โดยใส่พารามิเตอร์การค้นหา access_token หรือค่าส่วนหัว HTTP Bearer Authorization หากเป็นไปได้ เราขอแนะนำให้ใช้ส่วนหัว HTTP เนื่องจากสตริงการค้นหามักจะปรากฏในบันทึกของเซิร์ฟเวอร์ ในกรณีส่วนใหญ่ คุณสามารถใช้ไลบรารีของไคลเอ็นต์เพื่อตั้งค่าการเรียกใช้ Google API (เช่น เมื่อเรียกใช้ Drive Files API)
คุณลองใช้ Google APIs ทั้งหมดและดูขอบเขตได้ที่ OAuth 2.0 Playground
ตัวอย่าง HTTP GET
การเรียกไปยังปลายทาง
drive.files (Drive Files API) โดยใช้ส่วนหัว HTTP Authorization: Bearer อาจมีลักษณะดังต่อไปนี้ โปรดทราบว่าคุณต้องระบุโทเค็นเพื่อการเข้าถึงของคุณเอง ดังนี้
GET /drive/v2/files HTTP/1.1 Host: www.googleapis.com Authorization: Bearer access_token
ต่อไปนี้เป็นการเรียก API เดียวกันสำหรับผู้ใช้ที่ตรวจสอบสิทธิ์แล้วโดยใช้พารามิเตอร์สตริงการค้นหา access_token
GET https://www.googleapis.com/drive/v2/files?access_token=access_token
ตัวอย่างของ curl
คุณทดสอบคำสั่งเหล่านี้ได้ด้วยแอปพลิเคชันบรรทัดคำสั่ง curl ต่อไปนี้คือตัวอย่างที่ใช้ตัวเลือกส่วนหัว HTTP (แนะนำ)
curl -H "Authorization: Bearer access_token" https://www.googleapis.com/drive/v2/files
หรือตัวเลือกพารามิเตอร์สตริงการค้นหา
curl https://www.googleapis.com/drive/v2/files?access_token=access_token
โค้ดตัวอย่าง JavaScript
ข้อมูลโค้ดด้านล่างแสดงวิธีใช้ CORS (การแชร์ทรัพยากรแบบข้ามต้นทาง) เพื่อส่งคำขอไปยัง Google API ตัวอย่างนี้ไม่ได้ใช้ไลบรารีของไคลเอ็นต์ Google APIs สำหรับ JavaScript อย่างไรก็ตาม แม้ว่าคุณจะไม่ได้ใช้ไลบรารีของไคลเอ็นต์ แต่คู่มือการรองรับ CORS ในเอกสารประกอบของไลบรารีนั้นก็น่าจะช่วยให้คุณเข้าใจคำขอเหล่านี้ได้ดียิ่งขึ้น
ในข้อมูลโค้ดนี้ ตัวแปร access_token แสดงถึงโทเค็นที่คุณได้รับเพื่อส่งคำขอ API ในนามของผู้ใช้ที่ได้รับอนุญาต ตัวอย่างที่เสร็จสมบูรณ์จะแสดงวิธีจัดเก็บโทเค็นนั้นในพื้นที่เก็บข้อมูลในเครื่องของเบราว์เซอร์และดึงข้อมูลเมื่อส่งคำขอ API
var xhr = new XMLHttpRequest(); xhr.open('GET', 'https://www.googleapis.com/drive/v3/about?fields=user&' + 'access_token=' + params['access_token']); xhr.onreadystatechange = function (e) { console.log(xhr.response); }; xhr.send(null);
ตัวอย่างที่เสร็จสมบูรณ์
ปลายทางของ OAuth 2.0
ตัวอย่างโค้ดนี้แสดงวิธีทำตามขั้นตอน OAuth 2.0 ใน JavaScript ให้เสร็จสมบูรณ์โดยไม่ต้องใช้ไลบรารีของไคลเอ็นต์ Google APIs สำหรับ JavaScript โค้ดนี้มีไว้สำหรับหน้า HTML ที่แสดงปุ่มเพื่อลองใช้คำขอ API หากคุณคลิกปุ่ม โค้ดจะตรวจสอบว่าหน้าเว็บได้จัดเก็บโทเค็นเพื่อการเข้าถึง API ไว้ในพื้นที่เก็บข้อมูลในเครื่องของเบราว์เซอร์หรือไม่ หากใช่ ระบบจะดำเนินการตามคำขอ API ไม่เช่นนั้น ระบบจะเริ่มขั้นตอน OAuth 2.0
สำหรับขั้นตอน OAuth 2.0 หน้าเว็บจะทำตามขั้นตอนต่อไปนี้
- โดยจะนำผู้ใช้ไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google ซึ่งจะขอสิทธิ์เข้าถึงขอบเขต
https://www.googleapis.com/auth/drive.metadata.readonlyและhttps://www.googleapis.com/auth/calendar.readonly - หลังจากให้ (หรือปฏิเสธ) สิทธิ์เข้าถึงขอบเขตที่ขออย่างน้อย 1 รายการ ระบบจะเปลี่ยนเส้นทางผู้ใช้ไปยังหน้าเดิม ซึ่งจะแยกวิเคราะห์โทเค็นเพื่อการเข้าถึงจากสตริงตัวระบุส่วนย่อย
- หน้านี้จะตรวจสอบขอบเขตที่ผู้ใช้ให้สิทธิ์เข้าถึงแอปพลิเคชัน
หากผู้ใช้ให้สิทธิ์เข้าถึงขอบเขตที่ขอ หน้านี้จะใช้โทเค็นเพื่อการเข้าถึงเพื่อส่งคำขอ API ตัวอย่าง
คำขอ API จะเรียกใช้เมธอด
about.getของ Drive API เพื่อดึงข้อมูลเกี่ยวกับบัญชี Google ไดรฟ์ของผู้ใช้ที่ได้รับสิทธิ์- หากคำขอดำเนินการสำเร็จ ระบบจะบันทึกการตอบกลับจาก API ไว้ในคอนโซลการแก้ไขข้อบกพร่องของเบราว์เซอร์
คุณเพิกถอนสิทธิ์เข้าถึงแอปได้ผ่านหน้าสิทธิ์สำหรับบัญชี Google แอปจะแสดงเป็นชื่อแอปพลิเคชันที่ระบุไว้ในหน้าการสร้างแบรนด์ภายในหน้าจอขอความยินยอม OAuth ระหว่างการสร้างรหัสไคลเอ็นต์
หากต้องการเรียกใช้โค้ดนี้ในเครื่อง คุณต้องตั้งค่าตัวแปร YOUR_CLIENT_ID และ YOUR_REDIRECT_URI ที่สอดคล้องกับข้อมูลเข้าสู่ระบบสำหรับการให้สิทธิ์ ควรตั้งค่าตัวแปร YOUR_REDIRECT_URI เป็น URL เดียวกับที่แสดงหน้าเว็บ ค่าต้องตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตรายการใดรายการหนึ่งสำหรับไคลเอ็นต์ OAuth 2.0 ซึ่งคุณกำหนดค่าไว้ในหน้าไคลเอ็นต์ของ Cloud Console หากค่านี้ไม่ตรงกับ URI ที่ได้รับอนุญาต คุณจะได้รับข้อผิดพลาด redirect_uri_mismatch นอกจากนี้ โปรเจ็กต์ของคุณต้องเปิดใช้ API ที่เหมาะสมสำหรับคำขอนี้ด้วย
<html><head></head><body>
<script>
var YOUR_CLIENT_ID = 'REPLACE_THIS_VALUE';
var YOUR_REDIRECT_URI = 'REPLACE_THIS_VALUE';
// Parse query string to see if page request is coming from OAuth 2.0 server.
var fragmentString = location.hash.substring(1);
var params = {};
var regex = /([^&=]+)=([^&]*)/g, m;
while (m = regex.exec(fragmentString)) {
params[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
}
if (Object.keys(params).length > 0 && params['state']) {
if (params['state'] == localStorage.getItem('state')) {
localStorage.setItem('oauth2-test-params', JSON.stringify(params) );
trySampleRequest();
} else {
console.log('State mismatch. Possible CSRF attack');
}
}
// Function to generate a random state value
function generateCryptoRandomState() {
const randomValues = new Uint32Array(2);
window.crypto.getRandomValues(randomValues);
// Encode as UTF-8
const utf8Encoder = new TextEncoder();
const utf8Array = utf8Encoder.encode(
String.fromCharCode.apply(null, randomValues)
);
// Base64 encode the UTF-8 data
return btoa(String.fromCharCode.apply(null, utf8Array))
.replace(/\+/g, '-')
.replace(/\//g, '_')
.replace(/=+$/, '');
}
// If there's an access token, try an API request.
// Otherwise, start OAuth 2.0 flow.
function trySampleRequest() {
var params = JSON.parse(localStorage.getItem('oauth2-test-params'));
if (params && params['access_token']) {
// User authorized the request. Now, check which scopes were granted.
if (params['scope'].includes('https://www.googleapis.com/auth/drive.metadata.readonly')) {
// User authorized read-only Drive activity permission.
// Calling the APIs, etc.
var xhr = new XMLHttpRequest();
xhr.open('GET',
'https://www.googleapis.com/drive/v3/about?fields=user&' +
'access_token=' + params['access_token']);
xhr.onreadystatechange = function (e) {
if (xhr.readyState === 4 && xhr.status === 200) {
console.log(xhr.response);
} else if (xhr.readyState === 4 && xhr.status === 401) {
// Token invalid, so prompt for user permission.
oauth2SignIn();
}
};
xhr.send(null);
}
else {
// User didn't authorize read-only Drive activity permission.
// Update UX and application accordingly
console.log('User did not authorize read-only Drive activity permission.');
}
// Check if user authorized Calendar read permission.
if (params['scope'].includes('https://www.googleapis.com/auth/calendar.readonly')) {
// User authorized Calendar read permission.
// Calling the APIs, etc.
console.log('User authorized Calendar read permission.');
}
else {
// User didn't authorize Calendar read permission.
// Update UX and application accordingly
console.log('User did not authorize Calendar read permission.');
}
} else {
oauth2SignIn();
}
}
/*
* Create form to request access token from Google's OAuth 2.0 server.
*/
function oauth2SignIn() {
// create random state value and store in local storage
var state = generateCryptoRandomState();
localStorage.setItem('state', state);
// Google's OAuth 2.0 endpoint for requesting an access token
var oauth2Endpoint = 'https://accounts.google.com/o/oauth2/v2/auth';
// Create element to open OAuth 2.0 endpoint in new window.
var form = document.createElement('form');
form.setAttribute('method', 'GET'); // Send as a GET request.
form.setAttribute('action', oauth2Endpoint);
// Parameters to pass to OAuth 2.0 endpoint.
var params = {'client_id': YOUR_CLIENT_ID,
'redirect_uri': YOUR_REDIRECT_URI,
'scope': 'https://www.googleapis.com/auth/drive.metadata.readonly https://www.googleapis.com/auth/calendar.readonly',
'state': state,
'include_granted_scopes': 'true',
'response_type': 'token'};
// Add form parameters as hidden input values.
for (var p in params) {
var input = document.createElement('input');
input.setAttribute('type', 'hidden');
input.setAttribute('name', p);
input.setAttribute('value', params[p]);
form.appendChild(input);
}
// Add form to page and submit it to open the OAuth 2.0 endpoint.
document.body.appendChild(form);
form.submit();
}
</script>
<button onclick="trySampleRequest();">Try sample request</button>
</body></html>กฎการตรวจสอบต้นทางของ JavaScript
Google ใช้กฎการตรวจสอบต่อไปนี้กับต้นทาง JavaScript เพื่อช่วยนักพัฒนาแอปในการรักษาความปลอดภัยของแอปพลิเคชัน ต้นทาง JavaScript ต้องเป็นไปตามกฎเหล่านี้ ดูคำจำกัดความของโดเมน โฮสต์ และรูปแบบที่ใช้ในกฎเหล่านี้ได้ที่ RFC 3986 ส่วนที่ 3
| กฎการตรวจสอบความถูกต้อง | |
|---|---|
| รูปแบบ |
ต้นทางของ JavaScript ต้องใช้รูปแบบ HTTPS ไม่ใช่ HTTP ธรรมดา URI ของ Localhost (รวมถึง URI ของที่อยู่ IP ของ Localhost) จะได้รับการยกเว้นจากกฎนี้ |
| ผู้จัด |
โฮสต์ต้องไม่ใช่ที่อยู่ IP ดิบ ที่อยู่ IP ของ Localhost ได้รับการยกเว้นจากกฎนี้ |
| โดเมน |
“googleusercontent.com”goo.gl) เว้นแต่แอปจะเป็นเจ้าของโดเมน |
| Userinfo |
ต้นทาง JavaScript ต้องไม่มีคอมโพเนนต์ย่อย userinfo |
| เส้นทาง |
ต้นทาง JavaScript ต้องไม่มีคอมโพเนนต์เส้นทาง |
| การค้นหา |
ต้นทาง JavaScript ต้องไม่มีคอมโพเนนต์การค้นหา |
| Fragment |
ต้นทาง JavaScript ต้องไม่มีคอมโพเนนต์ Fragment |
| อักขระ |
ต้นทาง JavaScript ต้องไม่มีอักขระบางอย่าง ซึ่งรวมถึง
|
การให้สิทธิ์แบบเพิ่มทีละส่วน
ในโปรโตคอล OAuth 2.0 แอปของคุณจะขอสิทธิ์เข้าถึงทรัพยากร ซึ่งระบุตามขอบเขต แนวทางปฏิบัติแนะนำด้านประสบการณ์ของผู้ใช้คือการขอสิทธิ์เข้าถึงทรัพยากรในเวลาที่คุณต้องการ เซิร์ฟเวอร์การให้สิทธิ์ของ Google รองรับการให้สิทธิ์แบบเพิ่มทีละส่วนเพื่อให้สามารถดำเนินการดังกล่าวได้ ฟีเจอร์นี้ช่วยให้คุณขอขอบเขตได้ตามต้องการ และหากผู้ใช้ให้สิทธิ์สำหรับขอบเขตใหม่ ระบบจะแสดงผลรหัสการให้สิทธิ์ที่อาจแลกเปลี่ยนเป็นโทเค็นที่มีขอบเขตทั้งหมดที่ผู้ใช้ให้สิทธิ์แก่โปรเจ็กต์
ตัวอย่างเช่น แอปที่ให้ผู้ใช้ฟังตัวอย่างแทร็กเพลงและสร้างมิกซ์อาจต้องการทรัพยากรเพียงไม่กี่รายการเมื่อลงชื่อเข้าใช้ ซึ่งอาจเป็นเพียงชื่อของผู้ใช้ที่ลงชื่อเข้าใช้เท่านั้น อย่างไรก็ตาม การบันทึกมิกซ์ที่เสร็จสมบูรณ์จะต้องมีสิทธิ์เข้าถึง Google ไดรฟ์ของผู้ใช้ ผู้ใช้ส่วนใหญ่จะรู้สึกว่าเป็นเรื่องปกติหากระบบขอสิทธิ์เข้าถึง Google ไดรฟ์เฉพาะเมื่อแอปจำเป็นต้องใช้จริงๆ เท่านั้น
ในกรณีนี้ เมื่อลงชื่อเข้าใช้ แอปอาจขอขอบเขต openid และ profile เพื่อลงชื่อเข้าใช้ขั้นพื้นฐาน จากนั้นจึงขอขอบเขต https://www.googleapis.com/auth/drive.file ในภายหลังเมื่อมีการส่งคำขอแรกเพื่อบันทึกมิกซ์
กฎต่อไปนี้ใช้กับโทเค็นเพื่อการเข้าถึงที่ได้จากการให้สิทธิ์แบบเพิ่มขึ้น
- โทเค็นนี้สามารถใช้เพื่อเข้าถึงทรัพยากรที่สอดคล้องกับขอบเขตใดก็ได้ที่รวมอยู่ในการให้สิทธิ์แบบรวมใหม่
- เมื่อคุณใช้โทเค็นการรีเฟรชสำหรับการให้สิทธิ์แบบรวมเพื่อรับโทเค็นเพื่อการเข้าถึง โทเค็นเพื่อการเข้าถึงจะแสดงถึงการให้สิทธิ์แบบรวมและสามารถใช้กับค่า
scopeใดก็ได้ที่รวมอยู่ในการตอบกลับ - การให้สิทธิ์แบบรวมจะรวมขอบเขตทั้งหมดที่ผู้ใช้ให้สิทธิ์แก่โปรเจ็กต์ API แม้ว่าคำขอให้สิทธิ์จะมาจากไคลเอ็นต์ที่ต่างกันก็ตาม ตัวอย่างเช่น หากผู้ใช้ให้สิทธิ์เข้าถึงขอบเขตหนึ่งโดยใช้ไคลเอ็นต์เดสก์ท็อปของแอปพลิเคชัน แล้วให้สิทธิ์เข้าถึงอีกขอบเขตหนึ่งแก่แอปพลิเคชันเดียวกันผ่านไคลเอ็นต์มือถือ การให้สิทธิ์แบบรวมจะรวมทั้ง 2 ขอบเขต
- หากคุณเพิกถอนโทเค็นที่แสดงถึงการให้สิทธิ์แบบรวม ระบบจะเพิกถอนสิทธิ์เข้าถึงขอบเขตทั้งหมดของการให้สิทธิ์นั้นในนามของผู้ใช้ที่เชื่อมโยงพร้อมกัน
ตัวอย่างโค้ดด้านล่างแสดงวิธีเพิ่มขอบเขตลงในโทเค็นเพื่อการเข้าถึงที่มีอยู่ วิธีนี้ช่วยให้แอปของคุณไม่ต้องจัดการโทเค็นเพื่อการเข้าถึงหลายรายการ
ปลายทางของ OAuth 2.0
หากต้องการเพิ่มขอบเขตลงในโทเค็นเพื่อการเข้าถึงที่มีอยู่ ให้ใส่พารามิเตอร์ include_granted_scopes ในคำขอไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google
ข้อมูลโค้ดต่อไปนี้แสดงวิธีดำเนินการดังกล่าว ข้อมูลโค้ดจะถือว่าคุณได้จัดเก็บขอบเขตที่โทเค็นเพื่อการเข้าถึงของคุณใช้ได้ไว้ในพื้นที่เก็บข้อมูลในเครื่องของเบราว์เซอร์ (โค้ดตัวอย่างที่เสร็จสมบูรณ์จะจัดเก็บรายการขอบเขตที่โทเค็นเพื่อการเข้าถึงใช้ได้โดยการตั้งค่าพร็อพเพอร์ตี้ oauth2-test-params.scope ในพื้นที่เก็บข้อมูลในเครื่องของเบราว์เซอร์)
ข้อมูลโค้ดจะเปรียบเทียบขอบเขตที่โทเค็นเพื่อการเข้าถึงใช้ได้กับขอบเขตที่คุณต้องการใช้สำหรับการค้นหาหนึ่งๆ หากโทเค็นเพื่อการเข้าถึงไม่ครอบคลุมขอบเขตดังกล่าว ขั้นตอน OAuth 2.0 จะเริ่มขึ้น
ในที่นี้ ฟังก์ชัน oauth2SignIn จะเหมือนกับฟังก์ชันที่ระบุไว้ในขั้นตอนที่ 2 (และจะระบุไว้ในภายหลังในตัวอย่างที่เสร็จสมบูรณ์)
var SCOPE = 'https://www.googleapis.com/auth/drive.metadata.readonly'; var params = JSON.parse(localStorage.getItem('oauth2-test-params')); var current_scope_granted = false; if (params.hasOwnProperty('scope')) { var scopes = params['scope'].split(' '); for (var s = 0; s < scopes.length; s++) { if (SCOPE == scopes[s]) { current_scope_granted = true; } } } if (!current_scope_granted) { oauth2SignIn(); // This function is defined elsewhere in this document. } else { // Since you already have access, you can proceed with the API request. }
การเพิกถอนโทเค็น
ในบางกรณี ผู้ใช้อาจต้องการเพิกถอนสิทธิ์เข้าถึงที่ให้ไว้กับแอปพลิเคชัน ผู้ใช้สามารถเพิกถอนสิทธิ์เข้าถึงได้โดยไปที่ การตั้งค่าบัญชี ดูข้อมูลเพิ่มเติมได้ในเอกสารสนับสนุนเรื่องนำสิทธิ์เข้าถึงเว็บไซต์หรือแอปออกในส่วนเว็บไซต์และแอปของบุคคลที่สามที่มีสิทธิ์เข้าถึงบัญชีของคุณ
นอกจากนี้ แอปพลิเคชันยังเพิกถอนสิทธิ์เข้าถึงที่ได้รับโดยใช้โปรแกรมได้ด้วย การเพิกถอนแบบเป็นโปรแกรมมีความสำคัญในกรณีที่ผู้ใช้ยกเลิกการสมัครใช้บริการ นำแอปพลิเคชันออก หรือทรัพยากร API ที่แอปต้องใช้มีการเปลี่ยนแปลงอย่างมาก กล่าวคือ ส่วนหนึ่งของกระบวนการนำออกอาจรวมถึงคำขอ API เพื่อให้แน่ใจว่าสิทธิ์ที่ให้ไว้กับแอปพลิเคชันก่อนหน้านี้ถูกนำออกแล้ว
ปลายทางของ OAuth 2.0
หากต้องการเพิกถอนโทเค็นแบบเป็นโปรแกรม แอปพลิเคชันของคุณจะส่งคำขอไปยัง https://oauth2.googleapis.com/revoke และรวมโทเค็นเป็นพารามิเตอร์ ดังนี้
curl -d -X -POST --header "Content-type:application/x-www-form-urlencoded" \
https://oauth2.googleapis.com/revoke?token={token}โทเค็นอาจเป็นโทเค็นเพื่อการเข้าถึงหรือโทเค็นการรีเฟรชก็ได้ หากโทเค็นเป็นโทเค็นเพื่อการเข้าถึงและมีโทเค็นการรีเฟรชที่เกี่ยวข้อง ระบบจะเพิกถอนโทเค็นการรีเฟรชด้วย
หากการเพิกถอนได้รับการประมวลผลเรียบร้อยแล้ว รหัสสถานะ HTTP ของการตอบกลับจะเป็น 200 สำหรับเงื่อนไขข้อผิดพลาด ระบบจะแสดงรหัสสถานะ HTTP 400 พร้อมกับรหัสข้อผิดพลาด
ข้อมูลโค้ด JavaScript ต่อไปนี้แสดงวิธีเพิกถอนโทเค็นใน JavaScript โดยไม่ต้องใช้ไลบรารีของไคลเอ็นต์ Google APIs สำหรับ JavaScript เนื่องจากปลายทาง OAuth 2.0 ของ Google สำหรับการเพิกถอนโทเค็นไม่รองรับการแชร์ทรัพยากรแบบข้ามต้นทาง (CORS) โค้ดจึงสร้างแบบฟอร์มและส่งแบบฟอร์มไปยังปลายทางแทนที่จะใช้เมธอด XMLHttpRequest() เพื่อโพสต์คำขอ
function revokeAccess(accessToken) { // Google's OAuth 2.0 endpoint for revoking access tokens. var revokeTokenEndpoint = 'https://oauth2.googleapis.com/revoke'; // Create <form> element to use to POST data to the OAuth 2.0 endpoint. var form = document.createElement('form'); form.setAttribute('method', 'post'); form.setAttribute('action', revokeTokenEndpoint); // Add access token to the form so it is set as value of 'token' parameter. // This corresponds to the sample curl request, where the URL is: // https://oauth2.googleapis.com/revoke?token={token} var tokenField = document.createElement('input'); tokenField.setAttribute('type', 'hidden'); tokenField.setAttribute('name', 'token'); tokenField.setAttribute('value', accessToken); form.appendChild(tokenField); // Add form to page and submit it to actually revoke the token. document.body.appendChild(form); form.submit(); }
การใช้การป้องกันแบบครอบคลุมหลายบริการ
ขั้นตอนเพิ่มเติมที่คุณควรทำเพื่อปกป้องบัญชีของผู้ใช้คือการใช้การป้องกันแบบครอบคลุมหลายบริการโดยใช้บริการการป้องกันแบบครอบคลุมหลายบริการของ Google บริการนี้ช่วยให้คุณสมัครรับการแจ้งเตือนการดำเนินการด้านความปลอดภัยซึ่งให้ข้อมูลแก่แอปพลิเคชันเกี่ยวกับการเปลี่ยนแปลงที่สำคัญในบัญชีผู้ใช้ จากนั้น คุณสามารถใช้ข้อมูลดังกล่าวเพื่อดำเนินการตามวิธีที่คุณตัดสินใจตอบสนองต่อเหตุการณ์
ตัวอย่างประเภทเหตุการณ์ที่บริการการป้องกันแบบครอบคลุมหลายบริการของ Google ส่งไปยังแอปของคุณมีดังนี้
-
https://schemas.openid.net/secevent/risc/event-type/sessions-revoked -
https://schemas.openid.net/secevent/oauth/event-type/token-revoked -
https://schemas.openid.net/secevent/risc/event-type/account-disabled
ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีใช้การป้องกันแบบครอบคลุมหลายบริการและรายการเหตุการณ์ทั้งหมดที่พร้อมใช้งานได้ที่หน้า ปกป้องบัญชีผู้ใช้ด้วยการป้องกันแบบครอบคลุมหลายบริการ