การตรวจหาฟีเจอร์ WebAuthn ที่ง่ายขึ้นด้วย getClientCapabilities()

Eiji Kitamura

เผยแพร่เมื่อวันที่ 15 มกราคม 2025

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

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

ความเข้ากันได้

getClientCapabilities()

getClientCapabilities() คือ WebAuthn API ที่ช่วยให้บุคคลที่เชื่อถือระบุความสามารถที่ใช้ได้ หากต้องการใช้ API คุณต้องเรียกใช้ PublicKeyCredential.getClientCapabilities() พรอมต์ที่แสดงผลจะเปลี่ยนเป็นออบเจ็กต์ที่มีความสามารถ โดยแต่ละรายการจะระบุความพร้อมใช้งานด้วย true หรือ false หากความสามารถคือ undefined ให้พิจารณาความพร้อมให้บริการของความสามารถนั้น ไม่ทราบ

if (window.PublicKeyCredential &&
  if (PublicKeyCredential.getClientCapabilities) {
    const capabilities = await PublicKeyCredential.getClientCapabilities();
    if (capabilities.conditionalGet === true &&
        capabilities.passkeyPlatformAuthenticator === true) {
      // The browser supports passkeys and the conditional mediation.
    }
  }
}

conditionalCreate

เบราว์เซอร์สามารถสร้างข้อมูลเข้าสู่ระบบได้โดยไม่ต้องมี UI แบบโมดัลที่เห็นได้ชัดหากผู้ใช้ให้ความยินยอมในการสร้างแล้ว

conditionalGet

โดยเบราว์เซอร์จะตรวจสอบสิทธิ์ได้โดยแสดงพาสคีย์เป็นส่วนหนึ่งของกล่องโต้ตอบป้อนข้อความอัตโนมัติแทน UI แบบโมดอลที่เห็นได้ชัด ค่าเทียบเท่าที่มีอยู่คือ PublicKeyCredential.isConditionalMediationAvailable()

hybridTransport

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

passkeyPlatformAuthenticator

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

relatedOrigins

เบราว์เซอร์สามารถสร้างข้อมูลเข้าสู่ระบบและตรวจสอบสิทธิ์ด้วยข้อมูลดังกล่าวซึ่งไม่ตรงกับรหัส RP ได้ ตราบใดที่ระบุไว้ในไฟล์ต้นทางที่เกี่ยวข้อง

signalAllAcceptedCredentials

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

signalCurrentUserDetails

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

signalUnknownCredential

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

userVerifyingPlatformAuthenticator

เบราว์เซอร์สามารถสร้างและตรวจสอบสิทธิ์ด้วยข้อมูลเข้าสู่ระบบในโปรแกรมตรวจสอบสิทธิ์ของแพลตฟอร์ม แต่ไม่ได้หมายความว่าเบราว์เซอร์รองรับโปรโตคอลแบบผสม ค่าเทียบเท่าที่มีอยู่คือ PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable()

extensions

นอกจากนี้ RP ยังระบุส่วนขยายที่ใช้ได้โดยใช้ getClientCapabilities() ได้ด้วย

if (capabilities['extension:appid'] === true) {
  // appId extension is supported
}

ตัวระบุจะขึ้นต้นด้วย extension: ตามด้วยชื่อส่วนขยาย ดูชื่อส่วนขยายได้จากตัวระบุส่วนขยาย WebAuthn ที่กําหนดไว้ที่ IANA

ดูข้อมูลเพิ่มเติม

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