javascript - 如何确定设备是否可以在 Javascript 中使用 Webauthn 指纹登录？

Question

我为我的网站创建了一个 Webauthn 身份验证。
现在我正在尝试为最佳用户体验创建一个良好的界面。我的用户不是技术人员。

我对指纹认证作为选项感兴趣。通过 Yubico 2 或 Google Titan key 进行的网络身份验证在我的用户中非常罕见。当用户使用电子邮件和密码登录时，我想显示一条消息，例如“您想为下次访问注册指纹吗？[立即注册]”。

我想向正确的用户显示消息。
那么，如何决定在哪些情况下显示消息呢？

根据 https://caniuse.com/#search=PublicKeyCredential ,
首先，我可以使用这样的测试:
var support_webauthn = (typeof window['PublicKeyCredential'] !== "undefined")
这个测试确定浏览器是否支持公钥认证，也通过了测试不知道硬件有没有指纹传感器。

我知道 Android 设备允许 Webauthn 指纹身份验证(而不是 iPhone，例如)。因此，除此之外，我还可以检查操作系统是否为 AndroidisAndroid = /android/i.test(navigator.userAgent);
但在这种情况下，我无法向使用其他受支持设备的用户显示消息 - 例如使用 Macbook pro(指纹传感器工作)。

我该如何解决这个问题？

Answer 1

简答: WebAuthn 不允许您在创建凭证之前执行诸如探测 Authenticator 是否有指纹传感器之类的操作。
但是您可以使用 PublicKeyCredential 做什么它允许您使用 PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable 检测用户是否具有内置身份验证器，例如 Windows Hello、TouchID、带有指纹传感器的 Android 设备(即使没有指纹传感器，屏幕锁定也可以提供等效的用户验证功能) .所以这个函数返回一个 bool 值，如果用户有内置身份验证器，你可以使用 JavaScript 检查它，如果处理了，你将能够使用指纹传感器或屏幕锁定注册用户，否则不提示用户很简单。我个人从未看过 android，但总的来说，这对于检测内置身份验证器很有用。
更新 从 chrome 77 版开始，您可以使用 PublicKeyCredentialCreationOptions.extensions 提供的扩展程序对象是可选的，开发人员可以通过在创建凭据扩展对象期间指定并将 UVM bool 值设置为 true 来使用它。

extensions : {
    uvi: true,
    uvm: true
},

创建凭据后，客户端输出一个数组数组，其中包含 3 个值，其中包含有关如何验证用户的信息(例如指纹、pin、图案)和其他信息。但请记住，高级开发人员无法探测设备是否具有指纹传感器。请看 developer.mozilla.org作进一步解释。
但是，要使用 android 示例项目玩 webAuthn，可以在这里找到:
https://fidoalliance.org/developer-tutorial-webauthn-web-fido2-android/
https://codelabs.developers.google.com/codelabs/webauthn-reauth/#0