หน้านี้ได้รับการแปลโดย Cloud Translation API

OAuth 2.0 สำหรับเว็บแอปพลิเคชันฝั่งไคลเอ็นต์

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

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

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

ไลบรารีของไคลเอ็นต์ Google APIs และบริการ Google Identity

หากคุณใช้ไลบรารีของไคลเอ็นต์ Google APIs สำหรับ JavaScript ในการโทรที่ได้รับอนุญาตไปยัง Google คุณควรใช้ ไลบรารี JavaScript ของ Google Identity Services เพื่อจัดการขั้นตอน OAuth 2.0 โปรดดู Google Identity Services โมเดลโทเค็น ซึ่งก็คือ ตามขั้นตอนการให้สิทธิ์โดยนัย OAuth 2.0

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

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

ข้อกำหนดเบื้องต้น

เปิดใช้ API สำหรับโปรเจ็กต์

แอปพลิเคชันใดๆ ที่เรียกใช้ Google APIs จำเป็นต้องเปิดใช้ API เหล่านั้นใน API Console

วิธีเปิดใช้ API สำหรับโปรเจ็กต์

Open the API Library ใน Google API Console
If prompted, select a project, or create a new one.
API Library แสดงรายการ API ที่ใช้ได้ทั้งหมดโดยจัดกลุ่มตามผลิตภัณฑ์ ครอบครัว และความนิยม หากไม่เห็น API ที่ต้องการเปิดใช้ในรายการ ให้ใช้การค้นหาเพื่อ หากต้องการค้นหารหัสดังกล่าว หรือคลิกดูทั้งหมดในกลุ่มผลิตภัณฑ์นั้น
เลือก API ที่ต้องการเปิดใช้ แล้วคลิกปุ่มเปิดใช้
If prompted, enable billing.
If prompted, read and accept the API's Terms of Service.

สร้างข้อมูลเข้าสู่ระบบการให้สิทธิ์

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

Go to the Credentials page.
คลิกสร้างข้อมูลเข้าสู่ระบบ > รหัสไคลเอ็นต์ OAuth
เลือกประเภทแอปพลิเคชันเว็บแอปพลิเคชัน
กรอกข้อมูลในแบบฟอร์มให้ครบถ้วน แอปพลิเคชันที่ใช้ JavaScript เพื่อสร้างคำขอ Google API ที่ได้รับอนุญาต ต้องระบุต้นทาง JavaScript ที่ได้รับอนุญาต ต้นทางระบุโดเมนจาก ซึ่งแอปพลิเคชันจะส่งคำขอไปยังเซิร์ฟเวอร์ OAuth 2.0 ได้ ต้นทางเหล่านี้ต้องเป็นไปตาม เกี่ยวกับกฎการตรวจสอบของ Google

ระบุขอบเขตการเข้าถึง

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

ก่อนที่จะเริ่มใช้การให้สิทธิ์ OAuth 2.0 เราขอแนะนำให้คุณระบุขอบเขต ที่แอปของคุณจะต้องมีสิทธิ์เข้าถึง

เอกสารขอบเขต API ของ OAuth 2.0 จะมีข้อมูลแบบเต็ม รายการขอบเขตที่คุณอาจใช้เพื่อเข้าถึง 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

จำเป็น

รหัสไคลเอ็นต์สำหรับแอปพลิเคชันของคุณ คุณสามารถค้นหาค่านี้ใน API Console Credentials page

redirect_uri

จำเป็น

กำหนดว่าเซิร์ฟเวอร์ API จะเปลี่ยนเส้นทางผู้ใช้ไปที่ใดหลังจากที่ผู้ใช้ดำเนินการ ขั้นตอนการให้สิทธิ์ ค่าต้องตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตรายการใดรายการหนึ่งสำหรับ ไคลเอ็นต์ OAuth 2.0 ที่คุณกำหนดค่าไว้ใน API Console Credentials pageหากค่านี้ไม่ตรงกับ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตสำหรับ client_id ที่ระบุคุณจะได้รับ ข้อผิดพลาด redirect_uri_mismatch รายการ

โปรดทราบว่ารูปแบบ http หรือ https ลักษณะตัวพิมพ์ และเครื่องหมายทับปิดท้าย ("/") ต้องตรงกันทั้งหมด

response_type

จำเป็น

แอปพลิเคชัน JavaScript ต้องตั้งค่าของพารามิเตอร์เป็น token ช่วงเวลานี้ จะสั่งให้เซิร์ฟเวอร์การให้สิทธิ์ของ Google ส่งคืนโทเค็นเพื่อการเข้าถึงเป็น name=value ในตัวระบุส่วนย่อยของ URI (#) ที่ ระบบจะเปลี่ยนเส้นทางผู้ใช้หลังจากเสร็จสิ้นกระบวนการให้สิทธิ์

scope

จำเป็น

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

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

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

state

แนะนำ

ระบุค่าสตริงที่แอปพลิเคชันใช้เพื่อรักษาสถานะระหว่าง คำขอการให้สิทธิ์ และการตอบกลับของเซิร์ฟเวอร์การให้สิทธิ์ เซิร์ฟเวอร์จะแสดงผลค่าที่แน่นอนที่คุณส่งเป็นคู่ name=value ใน ตัวระบุส่วนย่อยของ URL (#) ของ redirect_uriหลังจากที่ผู้ใช้ยินยอมหรือปฏิเสธ คำขอเข้าถึง

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

สำคัญ: ไคลเอ็นต์ OAuth ต้องป้องกันไม่ให้มี CSRF ตามที่แจ้งไว้ใน ข้อกำหนดของ OAuth2 โดยวิธีหนึ่งที่ทำได้คือการใช้พารามิเตอร์ state เพื่อคง สถานะระหว่างคำขอการให้สิทธิ์และการตอบกลับของเซิร์ฟเวอร์การให้สิทธิ์

include_granted_scopes

ไม่บังคับ

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

enable_granular_consent

ไม่บังคับ

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

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

login_hint

ไม่บังคับ

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

ตั้งค่าพารามิเตอร์เป็นอีเมลหรือตัวระบุ sub ซึ่งก็คือ เทียบเท่ากับรหัส Google ของผู้ใช้

prompt

ไม่บังคับ

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

โดยค่าที่เป็นไปได้มีดังนี้

`none`	อย่าแสดงหน้าจอการตรวจสอบสิทธิ์หรือความยินยอม ต้องไม่ระบุด้วย ค่าอื่นๆ
`consent`	แจ้งให้ผู้ใช้ขอความยินยอม
`select_account`	แจ้งให้ผู้ใช้เลือกบัญชี

ตัวอย่างการเปลี่ยนเส้นทางไปยังเซิร์ฟเวอร์การให้สิทธิ์ของ Google

ด้านล่างนี้เป็นตัวอย่าง URL ที่มีตัวแบ่งบรรทัดและการเว้นวรรคเพื่อให้อ่านง่ายขึ้น

https://accounts.google.com/o/oauth2/v2/auth?
 scope=https%3A//www.googleapis.com/auth/drive.metadata.readonly&
 include_granted_scopes=true&
 response_type=token&
 state=state_parameter_passthrough_value&
 redirect_uri=https%3A//oauth2.example.com/code&
 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',
                '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 แบบฝังซึ่ง Google ไม่อนุญาต นโยบาย OAuth 2.0

Android

นักพัฒนาแอป Android อาจพบข้อความแสดงข้อผิดพลาดนี้เมื่อเปิดคำขอการให้สิทธิ์ใน android.webkit.WebView นักพัฒนาแอปควรใช้ไลบรารี Android แทน เช่น Google Sign-In สำหรับ Android หรือ AppAuth สำหรับ Android

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

iOS

นักพัฒนา iOS และ macOS อาจพบข้อผิดพลาดนี้เมื่อเปิดคำขอการให้สิทธิ์ใน WKWebView นักพัฒนาซอฟต์แวร์ควรใช้ไลบรารี iOS แทน เช่น Google Sign-In สำหรับ iOS หรือ OpenID Foundation AppAuth สำหรับ iOS

นักพัฒนาเว็บอาจพบข้อผิดพลาดนี้เมื่อแอป iOS หรือ macOS เปิดเว็บลิงก์ทั่วไปใน User Agent ที่ฝังและผู้ใช้ไปยังปลายทางการให้สิทธิ์ OAuth 2.0 ของ Google จาก เว็บไซต์ของคุณ นักพัฒนาควรอนุญาตให้ลิงก์ทั่วไปเปิดในเครื่องจัดการลิงก์เริ่มต้นของ ซึ่งมีทั้ง Universal Link หรือแอปเบราว์เซอร์เริ่มต้น SFSafariViewController ก็เป็นตัวเลือกที่รองรับเช่นกัน

`org_internal`

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

`invalid_client`

ต้นทางที่สร้างคำขอไม่ได้รับอนุญาตสำหรับไคลเอ็นต์นี้ โปรดดู origin_mismatch

`invalid_grant`

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

`origin_mismatch`

สคีม โดเมน และ/หรือพอร์ตของ JavaScript ที่สร้างคำขอการให้สิทธิ์ต้องไม่ ตรงกับ URI ต้นทางของ JavaScript ที่ได้รับอนุญาตซึ่งลงทะเบียนไว้สำหรับรหัสไคลเอ็นต์ OAuth ให้สิทธิ์การตรวจสอบแล้ว ต้นทางของ JavaScript ใน Google API Console Credentials page

`redirect_uri_mismatch`

redirect_uri ที่ส่งผ่านในคำขอการให้สิทธิ์ไม่ตรงกับรายการที่ได้รับอนุญาต URI การเปลี่ยนเส้นทางสำหรับรหัสไคลเอ็นต์ OAuth ตรวจสอบ URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตใน Google API Console Credentials page

สคีม โดเมน และ/หรือพอร์ตของ JavaScript ที่สร้างคำขอการให้สิทธิ์ต้องไม่ ตรงกับ URI ต้นทางของ JavaScript ที่ได้รับอนุญาตซึ่งลงทะเบียนไว้สำหรับรหัสไคลเอ็นต์ OAuth รีวิว JavaScript เริ่มต้นที่ได้รับอนุญาตใน Google API Console Credentials page

พารามิเตอร์ redirect_uri อาจอ้างถึงขั้นตอนนอกย่านความถี่ (OOB) ของ OAuth ที่ เลิกใช้งานแล้วและไม่มีการรองรับอีกต่อไป โปรดดู คำแนะนำในการย้ายข้อมูลเพื่ออัปเดต การผสานรวม

`invalid_request`

เกิดข้อผิดพลาดบางอย่างกับคำขอของคุณ ซึ่งอาจเกิดจากสาเหตุหลายประการ ดังนี้

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

ขั้นตอนที่ 3: จัดการการตอบกลับของเซิร์ฟเวอร์ OAuth 2.0

ปลายทาง OAuth 2.0

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

เซิร์ฟเวอร์ 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 ไดรฟ์

https://accounts.google.com/o/oauth2/v2/auth?
 scope=https%3A//www.googleapis.com/auth/drive.metadata.readonly&
 include_granted_scopes=true&
 response_type=token&
 state=state_parameter_passthrough_value&
 redirect_uri=https%3A//oauth2.example.com/code&
 client_id=client_id

หลังจากเสร็จสิ้นขั้นตอน OAuth 2.0 แล้ว ระบบจะเปลี่ยนเส้นทางคุณไปยัง http://localhost/oauth2callback URL ดังกล่าวจะแสดงค่า ข้อผิดพลาด 404 NOT FOUND รายการ เว้นแต่เครื่องของคุณจะมีการแสดงไฟล์ที่ ที่อยู่นั้น ขั้นตอนถัดไปจะให้รายละเอียดเพิ่มเติมเกี่ยวกับข้อมูลที่แสดงผลใน URI เมื่อผู้ใช้เปลี่ยนเส้นทางกลับไปที่แอปพลิเคชัน

การเรียกใช้ Google APIs

ปลายทาง OAuth 2.0

หลังจากแอปพลิเคชันได้รับโทเค็นเพื่อการเข้าถึงแล้ว คุณจะสามารถใช้โทเค็นดังกล่าวเพื่อเรียกไปยัง API ในนามของ บัญชีผู้ใช้ หากได้มีการให้สิทธิ์สำหรับขอบเขตการเข้าถึงที่ API กำหนด วิธีการคือ โทเค็นเพื่อการเข้าถึงในคำขอที่ส่งไปยัง API โดยรวมคำค้นหา access_token หรือค่า Bearer ของส่วนหัว HTTP Authorization เมื่อทำได้ ส่วนหัว HTTP ดีกว่า เนื่องจากสตริงการค้นหามักจะมองเห็นได้ในบันทึกของเซิร์ฟเวอร์ ส่วนใหญ่ คุณสามารถใช้ไลบรารีของไคลเอ็นต์เพื่อตั้งค่าการเรียก Google APIs (เช่น เมื่อ การเรียกใช้ Drive Files API)

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

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

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

หากต้องการเรียกใช้โค้ดนี้ภายในเครื่อง คุณต้องตั้งค่าสำหรับ YOUR_CLIENT_ID และ YOUR_REDIRECT_URI ตัวแปรที่ตรงกับ ข้อมูลเข้าสู่ระบบการให้สิทธิ์ ตัวแปร YOUR_REDIRECT_URI ควรตั้งค่าเป็น URL เดียวกับที่หน้าเว็บจะแสดง ค่าต้องตรงกันทุกประการกับรายการใดรายการหนึ่ง URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตสำหรับไคลเอ็นต์ OAuth 2.0 ซึ่งคุณกำหนดค่าไว้ใน API Console Credentials pageถ้า ค่านี้ไม่ตรงกับ 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']) {
      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 {
      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',
                  '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 จะได้รับการยกเว้นจากกฎนี้
โดเมน	โฮสต์ TLD (โดเมนระดับบนสุด) ต้องอยู่ในรายการคำต่อท้ายสาธารณะ โดเมนที่ฝากบริการจะเป็น `“googleusercontent.com”` ไม่ได้ ต้นทางของ JavaScript ต้องไม่มีโดเมนเครื่องมือย่อ URL (เช่น `goo.gl`) ยกเว้นกรณีที่แอปนั้นเป็นเจ้าของโดเมน
ข้อมูลผู้ใช้	ต้นทางของ JavaScript ต้องไม่มีคอมโพเนนต์ย่อย userinfo
เส้นทาง	ต้นทางของ JavaScript ต้องไม่มีคอมโพเนนต์เส้นทาง
การค้นหา	ต้นทางของ JavaScript ต้องไม่มีคอมโพเนนต์การค้นหา
เศษส่วน	ต้นทางของ JavaScript ต้องไม่มีคอมโพเนนต์ส่วนย่อย
อักขระ	ต้นทางของ JavaScript ต้องไม่มีอักขระบางตัว ได้แก่ อักขระไวลด์การ์ด (`'*'`) อักขระ ASCII ที่พิมพ์ไม่ได้ การเข้ารหัสแบบเปอร์เซ็นต์ไม่ถูกต้อง (การเข้ารหัสเปอร์เซ็นต์ใดๆ ที่ไม่ตามการเข้ารหัส URL) ของสัญลักษณ์เปอร์เซ็นต์ตามด้วยเลขฐานสิบหก 2 หลัก) อักขระ Null (อักขระ Null ที่เข้ารหัส เช่น `%00`, `%C0%80`)

การให้สิทธิ์ที่เพิ่มขึ้น

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

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

ในกรณีนี้ ขณะลงชื่อเข้าใช้ แอปอาจขอ openid และ profile ขอบเขตเพื่อดำเนินการลงชื่อเข้าใช้ขั้นพื้นฐาน จากนั้นจึงขอ https://www.googleapis.com/auth/drive.file ขอบเขต ณ เวลาที่ส่งคำขอแรกเพื่อบันทึก มิกซ์

กฎต่อไปนี้ใช้กับโทเค็นเพื่อการเข้าถึงที่ได้จากการให้สิทธิ์ที่เพิ่มขึ้น

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

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

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

ปลายทาง OAuth 2.0

หากต้องการเพิ่มขอบเขตในโทเค็นเพื่อการเข้าถึงที่มีอยู่ ให้ใส่ include_granted_scopes ในคำขอไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google

ข้อมูลโค้ดต่อไปนี้จะแสดงวิธีการ ข้อมูลโค้ดจะถือว่าคุณจัดเก็บ ขอบเขตที่โทเค็นเพื่อการเข้าถึงใช้งานได้ในพื้นที่เก็บข้อมูลในเครื่องของเบราว์เซอร์ (พารามิเตอร์ ตัวอย่างที่สมบูรณ์ โค้ดจัดเก็บรายการขอบเขตที่โทเค็นเพื่อการเข้าถึง ถูกต้องโดยการตั้งค่าพร็อพเพอร์ตี้ oauth2-test-params.scope ใน storage.)

ข้อมูลโค้ดจะเปรียบเทียบขอบเขตที่โทเค็นเพื่อการเข้าถึงใช้ได้กับขอบเขตที่คุณต้องการใช้ สำหรับคำค้นหาหนึ่งๆ หากโทเค็นเพื่อการเข้าถึงไม่ครอบคลุมขอบเขตดังกล่าว ขั้นตอน 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

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

OAuth 2.0 สำหรับเว็บแอปพลิเคชันฝั่งไคลเอ็นต์

ไลบรารีของไคลเอ็นต์ Google APIs และบริการ Google Identity

ข้อกำหนดเบื้องต้น

เปิดใช้ API สำหรับโปรเจ็กต์

สร้างข้อมูลเข้าสู่ระบบการให้สิทธิ์

ระบุขอบเขตการเข้าถึง

การได้รับโทเค็นเพื่อการเข้าถึง OAuth 2.0

ขั้นตอนที่ 1: เปลี่ยนเส้นทางไปยังเซิร์ฟเวอร์ OAuth 2.0 ของ Google

ปลายทาง OAuth 2.0

ตัวอย่างการเปลี่ยนเส้นทางไปยังเซิร์ฟเวอร์การให้สิทธิ์ของ Google

โค้ดตัวอย่าง JavaScript

ขั้นตอนที่ 2: Google แจ้งขอความยินยอมจากผู้ใช้

ข้อผิดพลาด

admin_policy_enforced

disallowed_useragent

Android

iOS

org_internal

invalid_client

invalid_grant

origin_mismatch

redirect_uri_mismatch

invalid_request

ขั้นตอนที่ 3: จัดการการตอบกลับของเซิร์ฟเวอร์ OAuth 2.0

ปลายทาง OAuth 2.0

ตัวอย่างการตอบกลับของเซิร์ฟเวอร์ OAuth 2.0

การเรียกใช้ Google APIs

ปลายทาง OAuth 2.0

ตัวอย่าง HTTP GET

ตัวอย่างของ curl

โค้ดตัวอย่าง JavaScript

ตัวอย่างที่สมบูรณ์

ปลายทาง OAuth 2.0

กฎการตรวจสอบต้นทางของ JavaScript

การให้สิทธิ์ที่เพิ่มขึ้น

ปลายทาง OAuth 2.0

การเพิกถอนโทเค็น

ปลายทาง OAuth 2.0

การใช้การป้องกันแบบครอบคลุมหลายบริการ

`admin_policy_enforced`

`disallowed_useragent`

`org_internal`

`invalid_client`

`invalid_grant`

`origin_mismatch`

`redirect_uri_mismatch`

`invalid_request`

ตัวอย่างของ `curl`