如何检测浏览器是否支持 webauthn

Question

Webauthn 目前仅在有限数量的设备上受支持https://caniuse.com/#search=webauthn。

在 JavaScript 中，我希望能够在向用户提供登录或加入表单之前检测用户浏览器是否支持。

检查 navigator.credentials 似乎有效，但这是检查此支持的正确方法吗？

if(!navigator.credentials) {
  alert('fail');
}

Answer 1

通过检查navigator.credentials您正在检查浏览器是否支持Credentials Management API，这不仅仅是 WebAuthn。

到目前为止，凭证管理 API 支持 3 种类型的凭证FederatedCredential，PasswordCredential和PublicKeyCredential。

WebAuthn 建立在PublicKeyCredential界面之上。请参阅https://www.w3.org/TR/webauthn/#iface-pkcredential。

所以你需要的是：

 if (typeof(PublicKeyCredential) == "undefined") {
   alert('fail');
 }

这就是为什么当您要求浏览器创建“WebAuthn 凭据”时，您需要指定公钥类型：navigator.credentials.create({ "publicKey": { ... } })，请参阅https://developer.mozilla.org/en-US/docs/Web/API/CredentialsContainer/create#参数。