Menyederhanakan deteksi fitur WebAuthn untuk kunci sandi

Temukan cara mendeteksi kemampuan WebAuthn dengan getClientCapabilities() dan menyesuaikan alur kerja autentikasi untuk pengguna Anda.

Dipublikasikan: 22 Januari 2025

Bagaimana cara memastikan alur kerja autentikasi Anda beradaptasi dengan lancar ke browser dan perangkat pengguna?

Mulai Chrome 133, getClientCapabilities() WebAuthn API hadir untuk membantu Anda menentukan fitur autentikasi mana yang didukung oleh browser. Dengan memanggil PublicKeyCredential.getClientCapabilities(), developer dapat mengambil daftar kemampuan yang didukung dan menyesuaikan alur kerja autentikasi.

Peningkatan ini memungkinkan developer membuat alur autentikasi yang lebih andal dan mudah digunakan yang disesuaikan dengan lingkungan pengguna mereka.

Berikut cara menerapkannya:

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

Metode ini membantu Anda menyesuaikan pengalaman autentikasi untuk pengguna dengan mengidentifikasi kemampuan yang didukung seperti kunci sandi, mediasi bersyarat (isi otomatis kunci sandi dalam dialog), transpor campuran (autentikasi lintas perangkat menggunakan Bluetooth), dan bahkan ekstensi.

Alasan pentingnya deteksi fitur

Dengan memahami kemampuan klien, Anda dapat:

  • Buat pengalaman pengguna yang lebih lancar dan tingkatkan keandalan autentikasi dengan menyesuaikan penerapan Anda ke fitur yang didukung klien.
  • Mengurangi error yang disebabkan oleh kemampuan WebAuthn yang tidak didukung.

Dengan menggunakan getClientCapabilites(), Anda dapat dengan yakin membuat pengalaman autentikasi yang berfungsi di berbagai perangkat dan browser.

Mulai jelajahi

Jika sudah siap, Anda dapat membaca Deteksi fitur WebAuthn yang lebih sederhana dengan getClientCapabilities() untuk mengetahui daftar lengkap kemampuan, petunjuk mendetail, dan beberapa praktik terbaik.

Untuk mempelajari kunci sandi dan login tanpa sandi lebih lanjut, buka halaman Chrome Kunci Sandi