如何確定設備是否可以使用 Javascript 中的 Webauthn 指紋登錄？

Question

我為我的網站創建了 Webauthn 身份驗證。 現在我正在嘗試創建一個良好的界面以獲得最佳的用戶體驗。 我的用戶不是技術人員。

我對作為選項的指紋認證感興趣。 通過 Yubico 2 或 Google Titan 密鑰的 webauthn 在我的用戶中非常罕見。 當用戶使用 email 和密碼登錄時，我想顯示一條消息，例如“您要為下次訪問注冊指紋嗎？[立即注冊]”。

我想向正確的用戶展示信息。 那么，如何決定在哪些情況下顯示消息呢？

根據https://caniuse.com/#search=PublicKeyCredential ，首先我可以使用這樣的測試：

var support_webauthn = (typeof window['PublicKeyCredential'] !== "undefined")

這個測試判斷瀏覽器是否支持公鑰認證，也通過測試不知道硬件有沒有指紋傳感器。

我知道 Android 設備允許 Webauthn 指紋認證（例如，而不是 iPhone）。 因此，除此之外，我還可以檢查操作系統是否為 Android isAndroid = /android/i.test(navigator.userAgent);

但在這種情況下，我無法使用其他受支持的設備向用戶顯示消息 - 例如使用 Macbook pro（指紋傳感器工作）。

我該如何處理這個問題？

Answer 1

簡短回答： WebAuthn 不允許您在創建憑證之前執行諸如探測 Authenticator 是否有指紋傳感器之類的操作。

但是您可以使用PublicKeyCredential做什么，它允許您檢測用戶是否具有內置身份驗證器，例如 Windows Hello、TouchID、Android 帶有指紋傳感器的設備（即使沒有指紋傳感器，屏幕鎖定也可以提供等效的用戶驗證功能）使用PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable 。 所以這個 function 返回一個 Boolean 值，你可以使用 JavaScript 檢查它，如果用戶有內置的身份驗證器，如果這樣處理，或者你將能夠使用指紋用戶鎖定或不注冊用戶傳感器很簡單。 我個人從未看過 android 但總的來說，這對於檢測內置身份驗證器很有用。

從 chrome 版本 77 開始更新，您可以使用由PublicKeyCredentialCreationOptions.extensions object 提供的擴展，這是一個可選的，開發人員可以通過在創建憑據擴展 object 並將 UVM Z824E2C64F35A2DA8 設置為 true 來使用它。

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

憑證創建后，客戶端輸出一個包含 3 個值的 arrays 數組，其中包含有關如何驗證用戶的信息（例如指紋、引腳、模式）和其他信息。 但請記住，開發人員無法提前探測設備是否具有指紋傳感器。 請查看developer.mozilla.org以獲得進一步的解釋。

但是，可以在這里找到使用 android 示例項目的 webAuthn：

https://fidoalliance.org/developer-tutorial-webauthn-web-fido2-android/ https://codelabs.developers.google.com/codelabs/webauthn-reauth/#0