ข้อมูลอัปเดตจาก FedCM: Domain Hint API

ใน Chrome 123 คุณจะใช้ Domain Hints ร่วมกับ Federated Credential Management API (FedCM) ได้ เมื่อใช้ Domain Hint API นักพัฒนาซอฟต์แวร์จะมอบประสบการณ์ของผู้ใช้ที่ดียิ่งขึ้นได้ด้วยการแสดงบัญชีการเข้าสู่ระบบแบบรวมศูนย์จากโดเมนที่ยอมรับเท่านั้น

Domain Hint API

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

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

ตัวอย่างการตอบสนอง JSON จากปลายทางของรายการบัญชีจะมีลักษณะดังนี้

{
 "accounts": [{
   "id": "1234",
   "given_name": "John",
   "name": "John Doe",
   "email": "john_doe@idp.example",
   "picture": "https://idp.example/profile/123",
   "approved_clients": ["123", "456", "789"],
  }, {
   "id": "5678",
   "given_name": "Johnny",
   "name": "Johnny",
   "email": "johnny@idp.example",
   "picture": "https://idp.example/profile/456"
   "approved_clients": ["abc", "def", "ghi"],
   "domain_hints": ["corp.example"]
  }]
}

RP สามารถเรียกใช้ navigator.credentials.get() ด้วยพร็อพเพอร์ตี้ domainHint เพื่อกรองบัญชี ตัวอย่างเช่น สมมติว่าผู้ใช้เข้าชม corp-partner.example และลงชื่อเข้าใช้ด้วยบัญชีจาก corp.example โดยเว็บไซต์จะเรียกใช้ API ดังนี้

return await navigator.credentials.get({
  identity: {
    providers: [{
      configURL: "https://idp.example/manifest.json",
      clientId: "abc",
      nonce: nonce,
      domainHint : "corp.example"
    }]
  }
});

ระบบจะไม่ส่งค่า domainHint ไปยังปลายทางของรายการบัญชีเพื่อกรองฝั่งเซิร์ฟเวอร์ เนื่องจากอาจเป็นเวกเตอร์การระบุตัวตนไปยัง IdP แต่ Chrome จะส่งคำขอ FedCM ตามปกติแทนและกรองบัญชีที่ไม่ตรงกับค่า domainHint ที่ระบุโดยการเรียก navigator.credentials.get() ออก จากนั้น Chrome จะแสดงกล่องโต้ตอบ FedCM แก่ผู้ใช้พร้อมรายการบัญชีใหม่ แนวทางนี้คล้ายกับ Login Hint API แต่ทั้ง 2 API นี้ตอบคำถามที่แตกต่างกัน Login Hint API มีไว้เพื่อตอบคำถามว่า "ตัวระบุใดสำหรับผู้ใช้ที่ฉันต้องการ" ส่วน Domain Hint มีไว้เพื่อตอบคำถามว่า "บัญชีนี้ต้องเป็นขององค์กรหรือเซิร์ฟเวอร์ใด"

เมื่อใช้ domainHint: "any" อยู่ Chrome จะกรองบัญชีที่ไม่มีโดเมนออก (กล่าวคือ ระบบจะไม่ส่งผ่าน domain_hints หรือเว้นว่างไว้) ตัวอย่างเช่น วิธีนี้อนุญาตกรณีการใช้งานที่ RP อนุญาตเฉพาะบัญชีที่จัดการในขั้นตอนลงชื่อสมัครใช้

เมื่อไม่มีบัญชีที่ตรงกับ domainHint กล่องโต้ตอบ FedCM จะแสดงข้อความแจ้งให้เข้าสู่ระบบ ซึ่งจะช่วยให้ผู้ใช้เข้าสู่ระบบบัญชี IdP ที่ตรงกับคำแนะนำที่ RP ขอได้ เมื่อผู้ใช้แตะข้อความแจ้ง หน้าต่างป๊อปอัปจะเปิดขึ้นพร้อม URL เข้าสู่ระบบที่ระบุไว้ในไฟล์คอนฟิ จากนั้นระบบจะเพิ่มคำแนะนำการเข้าสู่ระบบและพารามิเตอร์การค้นหาคำแนะนำโดเมนต่อท้ายลิงก์

ตัวอย่างพรอมต์การเข้าสู่ระบบเมื่อไม่มีบัญชีที่ตรงกับ domainHint
ตัวอย่างพรอมต์การเข้าสู่ระบบเมื่อไม่มีบัญชีที่ตรงกับ domainHint