เอกสารนี้อธิบายวิธีใช้การให้สิทธิ์ OAuth 2.0 เพื่อเข้าถึง YouTube Data API จากเว็บแอปพลิเคชัน JavaScript OAuth 2.0 อนุญาตให้ผู้ใช้ แชร์ข้อมูลบางอย่างกับแอปพลิเคชันโดยที่ยังเก็บชื่อผู้ใช้ รหัสผ่าน และข้อมูลอื่นๆ ไว้เป็นส่วนตัว ตัวอย่างเช่น แอปพลิเคชันสามารถใช้ OAuth 2.0 เพื่อขอสิทธิ์ ในการดึงข้อมูล YouTube ของช่อง
ขั้นตอน OAuth 2.0 นี้เรียกว่าขั้นตอนการให้สิทธิ์แบบโดยนัย โดยออกแบบมาสำหรับ แอปพลิเคชันที่เข้าถึง API เฉพาะในขณะที่ผู้ใช้อยู่ในแอปพลิเคชัน แอปพลิเคชันเหล่านี้ จัดเก็บข้อมูลที่เป็นความลับไม่ได้
ในโฟลว์นี้ แอปจะเปิด URL ของ Google ที่ใช้พารามิเตอร์การค้นหาเพื่อระบุแอป และประเภทการเข้าถึง API ที่แอปต้องการ คุณสามารถเปิด URL ในหน้าต่างเบราว์เซอร์ปัจจุบันหรือป๊อปอัป ผู้ใช้สามารถตรวจสอบสิทธิ์ด้วย Google และให้สิทธิ์ที่ขอได้ จากนั้น Google จะเปลี่ยนเส้นทางผู้ใช้กลับไปยังแอปของคุณ การเปลี่ยนเส้นทางจะมีโทเค็นเพื่อการเข้าถึง ซึ่งแอปของคุณจะยืนยันและใช้เพื่อส่งคำขอ API
ไลบรารีของไคลเอ็นต์ Google APIs และบริการระบุตัวตนของ Google
หากคุณใช้ไลบรารีของไคลเอ็นต์ Google APIs สำหรับ JavaScript เพื่อทำการเรียกที่ได้รับอนุญาตไปยัง Google คุณควรใช้ไลบรารี JavaScript ของ Google Identity Services เพื่อจัดการขั้นตอน OAuth 2.0 โปรดดูรูปแบบโทเค็นของบริการระบุตัวตนของ Google ซึ่งอิงตามโฟลว์การให้สิทธิ์โดยนัยของ OAuth 2.0
ข้อกำหนดเบื้องต้น
เปิดใช้ API สำหรับโปรเจ็กต์
แอปพลิเคชันใดก็ตามที่เรียกใช้ Google API จะต้องเปิดใช้ API เหล่านั้นใน API Console
วิธีเปิดใช้ API สำหรับโปรเจ็กต์
- Open the API Library ใน Google API Console
- If prompted, select a project, or create a new one.
- ใช้หน้าไลบรารีเพื่อค้นหาและเปิดใช้ YouTube Data API ค้นหา API อื่นๆ ที่แอปพลิเคชันของคุณจะใช้และเปิดใช้ API เหล่านั้นด้วย
สร้างข้อมูลเข้าสู่ระบบการให้สิทธิ์
แอปพลิเคชันที่ใช้ OAuth 2.0 เพื่อเข้าถึง Google APIs ต้องมีข้อมูลเข้าสู่ระบบการให้สิทธิ์ ที่ระบุแอปพลิเคชันไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google ขั้นตอนต่อไปนี้จะอธิบายวิธี สร้างข้อมูลเข้าสู่ระบบสำหรับโปรเจ็กต์ จากนั้นแอปพลิเคชันจะใช้ข้อมูลเข้าสู่ระบบเพื่อเข้าถึง API ที่คุณเปิดใช้สำหรับโปรเจ็กต์นั้นได้
- Go to the Credentials page.
- คลิกสร้างไคลเอ็นต์
- เลือกประเภทแอปพลิเคชันเป็นเว็บแอปพลิเคชัน
- กรอกข้อมูลในแบบฟอร์มให้ครบถ้วน แอปพลิเคชันที่ใช้ JavaScript เพื่อส่งคำขอ Google API ที่ได้รับอนุญาต ต้องระบุต้นทางของ JavaScript ที่ได้รับอนุญาต ต้นทางจะระบุโดเมนที่แอปพลิเคชันของคุณส่งคำขอไปยังเซิร์ฟเวอร์ OAuth 2.0 ได้ ต้นทางเหล่านี้ต้องเป็นไปตามกฎการตรวจสอบของ Google
ระบุขอบเขตการเข้าถึง
ขอบเขตช่วยให้แอปพลิเคชันขอสิทธิ์เข้าถึงเฉพาะทรัพยากรที่จำเป็นเท่านั้น ในขณะเดียวกันก็ ช่วยให้ผู้ใช้ควบคุมระดับการเข้าถึงที่อนุญาตให้แอปพลิเคชันของคุณได้ด้วย ดังนั้น จำนวนขอบเขตที่ขออาจมีความสัมพันธ์แบบผกผันกับความเป็นไปได้ที่จะได้รับความยินยอมจากผู้ใช้
ก่อนที่จะเริ่มใช้การให้สิทธิ์ OAuth 2.0 เราขอแนะนำให้คุณระบุขอบเขต ที่แอปจะต้องได้รับสิทธิ์เข้าถึง
YouTube Data API เวอร์ชัน 3 ใช้ขอบเขตต่อไปนี้
| ขอบเขต | คำอธิบาย |
|---|---|
https://www. |
จัดการบัญชี YouTube ของคุณ |
https://www. |
ดูรายชื่อสมาชิกปัจจุบันที่ใช้งานอยู่ในช่องของคุณ ระดับปัจจุบันของสมาชิก และวันที่เริ่มเป็นสมาชิก |
https://www. |
ดู แก้ไข และลบวิดีโอ YouTube การจัดประเภท ความคิดเห็น และคำบรรยายวิดีโออย่างถาวร |
https://www. |
ดูบัญชี YouTube ของคุณ |
https://www. |
จัดการวิดีโอ YouTube ของคุณ |
https://www. |
ดูและจัดการพื้นที่ของคุณและเนื้อหาที่เกี่ยวข้องใน YouTube |
https://www. |
ดูข้อมูลส่วนตัวของช่อง YouTube ของคุณที่เกี่ยวข้องในระหว่างกระบวนการตรวจสอบกับพาร์ทเนอร์ YouTube |
เอกสารขอบเขต API ของ OAuth 2.0 มีรายการขอบเขตทั้งหมด ที่คุณอาจใช้เพื่อเข้าถึง Google API
การขอโทเค็นเพื่อการเข้าถึง 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 |
จำเป็น
รหัสไคลเอ็นต์สำหรับแอปพลิเคชัน คุณดูค่านี้ได้ใน |
||||||||||||||||
redirect_uri |
จำเป็น
กำหนดว่าเซิร์ฟเวอร์ API จะเปลี่ยนเส้นทางผู้ใช้ไปที่ใดหลังจากที่ผู้ใช้ทำขั้นตอนการให้สิทธิ์เสร็จสมบูรณ์
ค่าต้องตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตสำหรับไคลเอ็นต์ OAuth 2.0 ซึ่งคุณกำหนดค่าไว้ใน
ของไคลเอ็นต์ หากค่านี้ไม่ตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตสำหรับ โปรดทราบว่ารูปแบบ |
||||||||||||||||
response_type |
จำเป็น
แอปพลิเคชัน JavaScript ต้องตั้งค่าพารามิเตอร์เป็น |
||||||||||||||||
scope |
จำเป็น
รายการขอบเขตที่คั่นด้วยช่องว่างซึ่งระบุทรัพยากรที่แอปพลิเคชันของคุณเข้าถึงได้ในนามของผู้ใช้ ค่าเหล่านี้จะแจ้งให้หน้าจอคำยินยอมที่ Google แสดงต่อผู้ใช้ทราบ ขอบเขตช่วยให้แอปพลิเคชันขอสิทธิ์เข้าถึงเฉพาะทรัพยากรที่จำเป็น และยังช่วยให้ผู้ใช้ควบคุมระดับการเข้าถึงที่อนุญาตให้แอปพลิเคชันของคุณได้ด้วย ดังนั้น จำนวนขอบเขตที่ขอ จึงมีความสัมพันธ์แบบผกผันกับแนวโน้มที่จะได้รับความยินยอมจากผู้ใช้ YouTube Data API เวอร์ชัน 3 ใช้ขอบเขตต่อไปนี้
เอกสารขอบเขต API ของ OAuth 2.0 มีรายการขอบเขตทั้งหมดที่คุณอาจใช้เพื่อเข้าถึง Google API เราขอแนะนำให้แอปพลิเคชันของคุณขอสิทธิ์เข้าถึงขอบเขตการให้สิทธิ์ในบริบท ทุกครั้งที่เป็นไปได้ การขอสิทธิ์เข้าถึงข้อมูลผู้ใช้ตามบริบทผ่านการให้สิทธิ์ทีละส่วนจะช่วยให้ผู้ใช้เข้าใจได้ง่ายขึ้นว่าทำไมแอปพลิเคชันของคุณจึงต้องมีสิทธิ์เข้าถึงที่ขอ |
||||||||||||||||
state |
แนะนำ
ระบุค่าสตริงที่แอปพลิเคชันใช้เพื่อรักษาสถานะระหว่างคำขอการให้สิทธิ์กับคำตอบของเซิร์ฟเวอร์การให้สิทธิ์
เซิร์ฟเวอร์จะแสดงค่าที่แน่นอนที่คุณส่งเป็นคู่ คุณใช้พารามิเตอร์นี้ได้หลายวัตถุประสงค์ เช่น การนำผู้ใช้ไปยัง
แหล่งข้อมูลที่ถูกต้องในแอปพลิเคชัน การส่ง Nonce และการลดความเสี่ยงของการปลอมแปลงคำขอข้ามเว็บไซต์
เนื่องจาก |
||||||||||||||||
include_granted_scopes |
ไม่บังคับ
ช่วยให้แอปพลิเคชันใช้การให้สิทธิ์ทีละส่วนเพื่อขอสิทธิ์เข้าถึงขอบเขตเพิ่มเติมตามบริบทได้
หากคุณตั้งค่าพารามิเตอร์นี้เป็น |
||||||||||||||||
enable_granular_consent |
ไม่บังคับ
ค่าเริ่มต้นคือ เมื่อ Google เปิดใช้สิทธิ์แบบละเอียดสำหรับแอปพลิเคชัน พารามิเตอร์นี้จะไม่มีผลอีกต่อไป |
||||||||||||||||
login_hint |
ไม่บังคับ
หากแอปพลิเคชันทราบว่าผู้ใช้รายใดพยายามตรวจสอบสิทธิ์ แอปพลิเคชันจะใช้พารามิเตอร์นี้ เพื่อเป็นคำแนะนำให้กับเซิร์ฟเวอร์การตรวจสอบสิทธิ์ของ Google ได้ เซิร์ฟเวอร์ใช้คำใบ้เพื่อ ลดความซับซ้อนของขั้นตอนการเข้าสู่ระบบโดยการป้อนข้อมูลในช่องอีเมลล่วงหน้าในแบบฟอร์มการลงชื่อเข้าใช้ หรือโดยการ เลือกเซสชันการเข้าสู่ระบบหลายรายการที่เหมาะสม ตั้งค่าพารามิเตอร์เป็นอีเมลหรือตัวระบุ |
||||||||||||||||
prompt |
ไม่บังคับ
รายการพรอมต์ที่คั่นด้วยช่องว่างและคำนึงถึงตัวพิมพ์เล็กและใหญ่เพื่อแสดงต่อผู้ใช้ หากคุณไม่ได้ ระบุพารามิเตอร์นี้ ระบบจะแจ้งให้ผู้ใช้ทราบเฉพาะครั้งแรกที่โปรเจ็กต์ของคุณ ขอสิทธิ์เข้าถึง ดูข้อมูลเพิ่มเติมได้ที่ แจ้งให้ขอความยินยอมอีกครั้ง ค่าที่เป็นไปได้มีดังนี้
|
||||||||||||||||
ตัวอย่างการเปลี่ยนเส้นทางไปยังเซิร์ฟเวอร์การให้สิทธิ์ของ Google
ตัวอย่าง URL แสดงอยู่ด้านล่าง โดยมีการเว้นบรรทัดและเว้นวรรคเพื่อให้ง่ายต่อการอ่าน คำขอ URL
เข้าถึงขอบเขตที่อนุญาตให้เข้าถึงเพื่อดึงข้อมูล YouTube ของผู้ใช้ โดยจะใช้การให้สิทธิ์แบบเพิ่มทีละรายการ (include_granted_scopes=true) เพื่อให้มั่นใจว่าโทเค็นเพื่อการเข้าถึงใหม่
ครอบคลุมขอบเขตใดๆ ที่ผู้ใช้เคยให้สิทธิ์เข้าถึงแอปพลิเคชันไว้ก่อนหน้านี้ นอกจากนี้ ในตัวอย่างยังมีการตั้งค่าพารามิเตอร์อื่นๆ อีกหลายรายการ
https://accounts.google.com/o/oauth2/v2/auth? scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fyoutube.force-ssl& include_granted_scopes=true& response_type=token& state=state_parameter_passthrough_value& redirect_uri=http%3A%2F%2Flocalhost%2Foauth2callback& 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/youtube.force-ssl 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 ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีที่ผู้ดูแลระบบอาจจำกัดการเข้าถึงขอบเขตทั้งหมดหรือขอบเขตที่มีความละเอียดอ่อนและ ขอบเขตที่จำกัดจนกว่าจะมีการให้สิทธิ์เข้าถึงรหัสไคลเอ็นต์ OAuth อย่างชัดแจ้งได้ที่บทความช่วยเหลือสำหรับผู้ดูแลระบบ Google Workspace ควบคุมว่าจะให้แอปของบุคคลที่สามและแอปภายในรายการใดเข้าถึงข้อมูล Google Workspace ได้บ้าง
disallowed_useragent
ปลายทางการให้สิทธิ์จะแสดงภายใน User-Agent แบบฝังที่นโยบาย OAuth 2.0 ของ Google ไม่อนุญาต
Android
นักพัฒนาแอป Android อาจเห็นข้อความแสดงข้อผิดพลาดนี้เมื่อเปิดคำขอการให้สิทธิ์ใน
android.webkit.WebView
นักพัฒนาแอปควรใช้ไลบรารี Android แทน เช่น
Google Sign-In สำหรับ Android หรือ
AppAuth สำหรับ Android ของ OpenID Foundation
นักพัฒนาเว็บอาจพบข้อผิดพลาดนี้เมื่อแอป Android เปิดลิงก์เว็บทั่วไปใน User-Agent แบบฝัง และผู้ใช้นำทางไปยังปลายทางการให้สิทธิ์ OAuth 2.0 ของ Google จาก เว็บไซต์ของคุณ นักพัฒนาแอปควรอนุญาตให้ลิงก์ทั่วไปเปิดในตัวแฮนเดิลลิงก์เริ่มต้นของ ระบบปฏิบัติการ ซึ่งรวมถึงทั้งตัวแฮนเดิล Android App Link หรือแอปเบราว์เซอร์เริ่มต้น นอกจากนี้ ไลบรารี แท็บที่กำหนดเองของ Android ยังเป็นตัวเลือกที่รองรับด้วย
iOS
นักพัฒนาแอป 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 ที่ได้รับอนุญาตใน
redirect_uri_mismatch
redirect_uri ที่ส่งในคำขอการให้สิทธิ์ไม่ตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาต
สำหรับรหัสไคลเอ็นต์ OAuth ตรวจสอบ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตใน
รูปแบบ โดเมน และ/หรือพอร์ตของ JavaScript ที่สร้างคำขอการให้สิทธิ์อาจไม่ตรงกับ URI ต้นทางของ JavaScript ที่ได้รับอนุญาตซึ่งลงทะเบียนไว้สำหรับรหัสไคลเอ็นต์ OAuth ตรวจสอบ ต้นทางของ JavaScript ที่ได้รับอนุญาตใน
พารามิเตอร์ 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แล้ว สตริง Fragment ยังมี พารามิเตอร์token_typeซึ่งตั้งค่าเป็นBearerเสมอ และพารามิเตอร์expires_inซึ่งระบุ อายุการใช้งานของโทเค็นเป็นวินาที หากมีการระบุพารามิเตอร์stateในคำขอโทเค็นเพื่อเข้าถึง ค่าของพารามิเตอร์จะรวมอยู่ในการตอบกลับด้วย- การตอบกลับข้อผิดพลาด
https://oauth2.example.com/callback#error=access_denied
ตัวอย่างการตอบกลับของเซิร์ฟเวอร์ OAuth 2.0
คุณทดสอบโฟลว์นี้ได้โดยคลิกลิงก์ตัวอย่างต่อไปนี้ ซึ่งจะขอสิทธิ์เข้าถึงแบบอ่านอย่างเดียวเพื่อดูข้อมูลเมตาของไฟล์ใน Google ไดรฟ์ และสิทธิ์เข้าถึงแบบอ่านอย่างเดียวเพื่อดูกิจกรรมใน Google ปฏิทิน
https://accounts.google.com/o/oauth2/v2/auth? scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fyoutube.force-ssl& include_granted_scopes=true& response_type=token& state=state_parameter_passthrough_value& redirect_uri=http%3A%2F%2Flocalhost%2Foauth2callback& client_id=client_id
หลังจากทำโฟลว์ OAuth 2.0 เสร็จแล้ว ระบบจะเปลี่ยนเส้นทางคุณไปยัง
http://localhost/oauth2callback URL นั้นจะทำให้เกิดข้อผิดพลาด 404 NOT FOUND เว้นแต่เครื่องในเครือข่ายของคุณจะให้บริการไฟล์ที่
ที่อยู่นั้น ขั้นตอนถัดไปจะให้รายละเอียดเพิ่มเติมเกี่ยวกับข้อมูลที่ส่งคืนใน
URI เมื่อระบบเปลี่ยนเส้นทางผู้ใช้กลับไปยังแอปพลิเคชันของคุณ
ขั้นตอนที่ 4: ตรวจสอบขอบเขตที่ผู้ใช้ให้สิทธิ์
เมื่อขอสิทธิ์ (ขอบเขต) หลายรายการ ผู้ใช้อาจไม่ให้สิทธิ์แอปของคุณเข้าถึง สิทธิ์ทั้งหมด แอปของคุณต้องยืนยันว่ามีการให้ขอบเขตใดบ้างจริง และจัดการสถานการณ์ที่ระบบปฏิเสธสิทธิ์บางอย่างอย่างเหมาะสม โดยปกติแล้วจะปิดใช้ฟีเจอร์ที่ต้องใช้ขอบเขตที่ถูกปฏิเสธเหล่านั้น
แต่ก็มีข้อยกเว้น แอป Google Workspace Enterprise ที่มี การมอบสิทธิ์ระดับโดเมน หรือแอปที่ทำเครื่องหมายเป็น เชื่อถือได้ จะข้ามหน้าจอขอความยินยอมให้สิทธิ์แบบละเอียด สำหรับแอปเหล่านี้ ผู้ใช้จะไม่เห็นหน้าจอคำยินยอมให้สิทธิ์แบบละเอียด แต่แอปของคุณจะได้รับขอบเขตที่ขอทั้งหมด หรือไม่ได้รับเลย
ดูข้อมูลโดยละเอียดเพิ่มเติมได้ที่ วิธีจัดการสิทธิ์แบบละเอียด
ปลายทาง OAuth 2.0
หากต้องการตรวจสอบว่าผู้ใช้ได้ให้สิทธิ์แอปพลิเคชันของคุณเข้าถึงขอบเขตใดขอบเขตหนึ่งหรือไม่ ให้
ตรวจสอบฟิลด์ scope ในการตอบกลับโทเค็นเพื่อการเข้าถึง ขอบเขตการเข้าถึงที่ได้รับจาก
access_token ซึ่งแสดงเป็นรายการสตริงที่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่โดยมีช่องว่างคั่น
ตัวอย่างเช่น การตอบกลับโทเค็นเพื่อการเข้าถึงตัวอย่างต่อไปนี้บ่งชี้ว่าผู้ใช้ได้ให้สิทธิ์แอปพลิเคชันของคุณเข้าถึงสิทธิ์กิจกรรมในไดรฟ์แบบอ่านอย่างเดียวและสิทธิ์กิจกรรมในปฏิทิน
{ "access_token": "1/fFAGRNJru1FTz70BzhT3Zg", "expires_in": 3920, "token_type": "Bearer", "scope": "https://www.googleapis.com/auth/youtube.force-ssl https://www.googleapis.com/auth/calendar.readonly", "refresh_token": "1//xEoDL4iW3cxlI7yDbSRFYNG01kVKM2C-259HOF2aQbI" }
การเรียก Google APIs
ปลายทาง OAuth 2.0
หลังจากที่แอปพลิเคชันได้รับโทเค็นเพื่อการเข้าถึงแล้ว คุณจะใช้โทเค็นเพื่อเรียก Google API ในนามของบัญชีผู้ใช้ที่ระบุได้ หากได้รับขอบเขตการเข้าถึงที่ API ต้องการ โดยให้ใส่โทเค็นเพื่อการเข้าถึงในคำขอไปยัง API โดยใส่พารามิเตอร์การค้นหา access_token หรือค่าส่วนหัว HTTP Authorization Bearer หากเป็นไปได้ เราขอแนะนำให้ใช้ส่วนหัว HTTP เนื่องจากสตริงการค้นหามักจะปรากฏในบันทึกของเซิร์ฟเวอร์ ในกรณีส่วนใหญ่ คุณสามารถใช้ไลบรารีของไคลเอ็นต์เพื่อตั้งค่าการเรียกไปยัง Google API ได้ (เช่น เมื่อเรียกใช้ YouTube Live Streaming API)
โปรดทราบว่า YouTube Live Streaming API ไม่รองรับโฟลว์บัญชีบริการ เนื่องจากไม่มีวิธีลิงก์บัญชีบริการกับบัญชี YouTube การพยายามให้สิทธิ์คำขอด้วยขั้นตอน
นี้จะทำให้เกิดข้อผิดพลาด NoLinkedYouTubeAccount
คุณลองใช้ Google APIs ทั้งหมดและดูขอบเขตของ API ได้ที่ OAuth 2.0 Playground
ตัวอย่าง HTTP GET
การเรียกไปยัง
liveBroadcasts.list
ปลายทาง (YouTube Live Streaming API) โดยใช้ส่วนหัว HTTP Authorization: Bearer
อาจมีลักษณะดังนี้ โปรดทราบว่าคุณต้องระบุโทเค็นเพื่อการเข้าถึงของคุณเอง
GET /youtube/v3/liveBroadcasts?part=id%2Csnippet&mine=true HTTP/1.1 Host: www.googleapis.com Authorization: Bearer access_token
ต่อไปนี้คือการเรียก API เดียวกันสำหรับผู้ใช้ที่ได้รับการตรวจสอบสิทธิ์โดยใช้พารามิเตอร์สตริงการค้นหา access_token
GET https://www.googleapis.com/youtube/v3/liveBroadcasts?access_token=access_token&part=id%2Csnippet&mine=true
ตัวอย่างของ curl
คุณทดสอบคำสั่งเหล่านี้ได้ด้วยแอปพลิเคชันบรรทัดคำสั่ง curl ต่อไปนี้คือตัวอย่างที่ใช้ตัวเลือกส่วนหัว HTTP (แนะนำ)
curl -H "Authorization: Bearer access_token" https://www.googleapis.com/youtube/v3/liveBroadcasts?part=id%2Csnippet&mine=true
หรืออีกทางเลือกหนึ่งคือตัวเลือกพารามิเตอร์สตริงการค้นหา
curl https://www.googleapis.com/youtube/v3/liveBroadcasts?access_token=access_token&part=id%2Csnippet&mine=true
ตัวอย่างโค้ด JavaScript
ข้อมูลโค้ดด้านล่างแสดงวิธีใช้ CORS (การแชร์ทรัพยากรข้ามโดเมน) เพื่อส่งคำขอไปยัง Google API ตัวอย่างนี้ไม่ได้ใช้ไลบรารีของไคลเอ็นต์ Google APIs สำหรับ JavaScript อย่างไรก็ตาม แม้ว่าคุณจะไม่ได้ใช้ไลบรารีของไคลเอ็นต์ แต่คำแนะนำเกี่ยวกับการรองรับ CORS ในเอกสารประกอบของไลบรารีนั้นน่าจะช่วยให้คุณเข้าใจคำขอเหล่านี้ได้ดียิ่งขึ้น
ในข้อมูลโค้ดนี้ ตัวแปร access_token แสดงถึงโทเค็นที่คุณได้รับ
เพื่อส่งคำขอ API ในนามของผู้ใช้ที่ได้รับอนุญาต ตัวอย่าง
ที่สมบูรณ์แสดงวิธีจัดเก็บโทเค็นนั้นไว้ในพื้นที่เก็บข้อมูลในเครื่องของเบราว์เซอร์และเรียกข้อมูล
เมื่อส่งคำขอ API
var xhr = new XMLHttpRequest(); xhr.open('GET', 'https://www.googleapis.com/youtube/v3/liveBroadcasts?part=id,snippet&mine=true' + '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/youtube.force-sslและhttps://www.googleapis.com/auth/calendar.readonly - หลังจากให้ (หรือปฏิเสธ) สิทธิ์เข้าถึงขอบเขตที่ขออย่างน้อย 1 รายการ ระบบจะเปลี่ยนเส้นทางผู้ใช้ไปยัง หน้าเดิม ซึ่งจะแยกวิเคราะห์โทเค็นเพื่อการเข้าถึงจากสตริงตัวระบุส่วนย่อย
- หน้านี้จะตรวจสอบว่าผู้ใช้ได้ให้สิทธิ์เข้าถึงแอปพลิเคชันในขอบเขตใดบ้าง
หากผู้ใช้ให้สิทธิ์เข้าถึงขอบเขตที่ขอ ระบบจะใช้โทเค็นเพื่อการเข้าถึงเพื่อส่งคำขอ API ตัวอย่าง
คำขอ API นี้จะเรียกใช้
liveBroadcasts.listเมธอดของ YouTube Data API เพื่อดึงรายการการถ่ายทอดสดวิดีโอสำหรับช่อง YouTube ของผู้ใช้ที่ได้รับอนุญาต- หากคำขอทำงานสำเร็จ ระบบจะบันทึกการตอบกลับของ API ในคอนโซลการแก้ไขข้อบกพร่องของเบราว์เซอร์
คุณเพิกถอนสิทธิ์เข้าถึงแอปได้ผ่านหน้าสิทธิ์สำหรับบัญชี Google แอปจะแสดงเป็น OAuth 2.0 Demo for Google API Docs
หากต้องการเรียกใช้โค้ดนี้ในเครื่อง คุณต้องตั้งค่าตัวแปร YOUR_CLIENT_ID และ
YOUR_REDIRECT_URI ที่สอดคล้องกับ
ข้อมูลเข้าสู่ระบบการให้สิทธิ์ ควรตั้งค่าตัวแปร YOUR_REDIRECT_URI
เป็น URL เดียวกันกับที่แสดงหน้าเว็บ ค่าต้องตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตสำหรับไคลเอ็นต์ OAuth 2.0 อย่างใดอย่างหนึ่ง ซึ่งคุณกำหนดค่าไว้ใน
หาก
ค่านี้ไม่ตรงกับ 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/youtube/v3/liveBroadcasts?part=id,snippet&mine=true' +
'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/youtube.force-ssl 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 ต้องเป็นไปตามกฎต่อไปนี้ ดูคำจำกัดความของโดเมน โฮสต์ และรูปแบบที่กล่าวถึงด้านล่างได้ในส่วนที่ 3 ของ RFC 3986
| กฎการตรวจสอบความถูกต้อง | |
|---|---|
| รูปแบบ |
ต้นทาง 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 รองรับการให้สิทธิ์แบบเพิ่มทีละรายการเพื่อเปิดใช้แนวทางดังกล่าว ฟีเจอร์นี้ช่วยให้คุณขอขอบเขตได้ตามต้องการ และหากผู้ใช้ให้สิทธิ์สำหรับขอบเขตใหม่ ระบบจะแสดงรหัสการให้สิทธิ์ที่อาจแลกเปลี่ยนเป็นโทเค็นที่มีขอบเขตทั้งหมดที่ผู้ใช้ให้สิทธิ์แก่โปรเจ็กต์
เช่น สมมติว่าแอปดึงข้อมูลสำหรับช่อง YouTube ของผู้ใช้ที่ผ่านการตรวจสอบสิทธิ์ และยัง
ช่วยให้ผู้ใช้ดึงข้อมูลข้อมูลวิเคราะห์ YouTube ผ่านโฟลว์พิเศษได้ด้วย ในกรณีนี้ เมื่อลงชื่อเข้าใช้
แอปอาจขอสิทธิ์เข้าถึงเฉพาะขอบเขต https://www.googleapis.com/auth/youtube.force-ssl
อย่างไรก็ตาม หากผู้ใช้พยายามเข้าถึงข้อมูล Analytics ของช่อง แอปอาจขอสิทธิ์เข้าถึงhttps://www.googleapis.com/auth/yt-analytics.readonlyขอบเขต
กฎต่อไปนี้จะมีผลกับโทเค็นเพื่อการเข้าถึงที่ได้รับจากการให้สิทธิ์แบบเพิ่มทีละรายการ
- คุณใช้โทเค็นเพื่อเข้าถึงทรัพยากรที่สอดคล้องกับขอบเขตใดก็ได้ที่รวมอยู่ในการให้สิทธิ์แบบใหม่ที่รวมกันได้
- เมื่อใช้โทเค็นการรีเฟรชสำหรับการให้สิทธิ์แบบรวมเพื่อรับโทเค็นเพื่อการเข้าถึง โทเค็นเพื่อการเข้าถึงจะแสดงการให้สิทธิ์แบบรวมและใช้กับค่า
scopeใดก็ได้ที่รวมอยู่ในคำตอบ - การให้สิทธิ์แบบรวมจะรวมขอบเขตทั้งหมดที่ผู้ใช้ให้แก่โปรเจ็กต์ API แม้ว่าจะมีการขอสิทธิ์จากไคลเอ็นต์ที่แตกต่างกันก็ตาม เช่น หากผู้ใช้ให้สิทธิ์เข้าถึงขอบเขตหนึ่งโดยใช้ไคลเอ็นต์เดสก์ท็อปของแอปพลิเคชัน แล้วให้สิทธิ์เข้าถึงอีกขอบเขตหนึ่งแก่แอปพลิเคชันเดียวกันผ่านไคลเอ็นต์บนอุปกรณ์เคลื่อนที่ การให้สิทธิ์รวมจะรวมทั้ง 2 ขอบเขต
- หากเพิกถอนโทเค็นที่แสดงถึงการให้สิทธิ์แบบรวม ระบบจะเพิกถอนสิทธิ์เข้าถึงขอบเขตทั้งหมดของการให้สิทธิ์นั้นในนามของผู้ใช้ที่เชื่อมโยงพร้อมกัน
ตัวอย่างโค้ดด้านล่างแสดงวิธีเพิ่มขอบเขตไปยังโทเค็นเพื่อการเข้าถึงที่มีอยู่ วิธีนี้ช่วยให้แอปของคุณไม่ต้องจัดการโทเค็นเพื่อการเข้าถึงหลายรายการ
ปลายทาง OAuth 2.0
ในตัวอย่างนี้ แอปพลิเคชันการโทรขอสิทธิ์เข้าถึงเพื่อดึงข้อมูล YouTube ของผู้ใช้ นอกเหนือจากสิทธิ์เข้าถึงอื่นๆ ที่ผู้ใช้ ให้แก่แอปพลิเคชันแล้ว
หากต้องการเพิ่มขอบเขตไปยังโทเค็นเพื่อการเข้าถึงที่มีอยู่ ให้ใส่พารามิเตอร์ include_granted_scopes
ในคำขอไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google
ข้อมูลโค้ดต่อไปนี้แสดงวิธีดำเนินการดังกล่าว ข้อมูลโค้ดนี้ถือว่าคุณได้จัดเก็บขอบเขตที่โทเค็นเพื่อการเข้าถึงของคุณใช้ได้ไว้ในพื้นที่เก็บข้อมูลในเครื่องของเบราว์เซอร์ (โค้ดตัวอย่างที่สมบูรณ์จะจัดเก็บรายการขอบเขตที่โทเค็นการเข้าถึง
ใช้ได้โดยการตั้งค่าพร็อพเพอร์ตี้ oauth2-test-params.scope ในพื้นที่เก็บข้อมูลในเครื่องของเบราว์เซอร์)
ข้อมูลโค้ดจะเปรียบเทียบขอบเขตที่โทเค็นเพื่อการเข้าถึงใช้ได้กับขอบเขตที่คุณต้องการใช้
สำหรับการค้นหาที่เฉพาะเจาะจง หากโทเค็นเพื่อการเข้าถึงไม่ครอบคลุมขอบเขตดังกล่าว โฟลว์ OAuth 2.0 จะเริ่มขึ้น
ในที่นี้ ฟังก์ชัน oauth2SignIn จะเหมือนกับฟังก์ชันที่ระบุไว้ในขั้นตอนที่ 2 (และฟังก์ชันที่ระบุไว้ในตัวอย่าง
ที่สมบูรณ์ในภายหลัง)
var SCOPE = 'https://www.googleapis.com/auth/youtube.force-ssl'; 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
ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีใช้การป้องกันแบบครอบคลุมหลายบริการและรายการเหตุการณ์ทั้งหมดที่ใช้ได้ใน หน้าปกป้องบัญชีผู้ใช้ด้วยการป้องกันแบบครอบคลุมหลายบริการ