ลดความซับซ้อนในการตรวจหาฟีเจอร์ WebAuthn สำหรับพาสคีย์

ดูวิธีตรวจหาความสามารถของ WebAuthn ด้วย getClientCapabilities() และปรับแต่งเวิร์กโฟลว์การตรวจสอบสิทธิ์ให้กับผู้ใช้

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

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

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

การปรับปรุงนี้ช่วยให้นักพัฒนาแอปสร้างขั้นตอนการตรวจสอบสิทธิ์ที่มีประสิทธิภาพและใช้งานง่ายยิ่งขึ้น ซึ่งปรับให้เหมาะกับสภาพแวดล้อมของผู้ใช้

วิธีติดตั้งใช้งานมีดังนี้

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

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

เหตุใดการตรวจหาองค์ประกอบจึงสำคัญ

การทำความเข้าใจความสามารถของไคลเอ็นต์จะช่วยให้คุณทำสิ่งต่อไปนี้ได้

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

เมื่อใช้ getClientCapabilites() คุณสามารถสร้างประสบการณ์การตรวจสอบสิทธิ์ที่ใช้งานได้กับอุปกรณ์และเบราว์เซอร์ที่หลากหลายได้อย่างมั่นใจ

เริ่มสำรวจ

หากพร้อมที่จะเริ่มต้นใช้งาน โปรดดูการตรวจหาฟีเจอร์ WebAuthn ที่ง่ายขึ้นด้วย getClientCapabilities() เพื่อดูรายการความสามารถทั้งหมด วิธีการโดยละเอียด และแนวทางปฏิบัติแนะนำบางส่วน

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