協助使用者更順利地採用密碼金鑰

發布日期:2025 年 5 月 9 日

密碼金鑰提供防範網路釣魚的強大驗證機制。不過,要讓使用者採用這些功能可能會造成摩擦。只要使用者已為您的網站儲存密碼,您就能透過自動密碼金鑰建立功能,在適當的時機為使用者建立密碼金鑰。條件式建立功能可讓系統自動建立密碼金鑰,是 WebAuthn 規格的一部分。

運作方式

為協助使用者更方便地採用密碼金鑰,請使用名為「Conditional Create」的 WebAuthn API 功能。使用條件式建立功能,網站就能為使用者要求密碼金鑰,而使用者不必採取任何行動。

這個流程適用於符合下列條件時:

  • 使用者在預設密碼管理工具中儲存密碼。
  • 密碼最近已使用過。理想情況下,應在使用者成功以密碼登入後立即呼叫 Conditional Create。

如果兩個條件都符合,您可以要求密碼管理工具透過呼叫「有條件建立」為使用者建立密碼金鑰。成功建立密碼金鑰後,系統會根據密碼管理工具通知使用者。

含有條件建立作業的密碼金鑰要求流程。

相容性

macOS 和 iOS 版 Safari 以及 電腦版 Chrome 都支援條件建立功能。

實作條件式建立

自動建立密碼金鑰功能是根據名為「Conditional Create」的 WebAuthn API 功能。這些是一般 WebAuthn create() 要求,其 mediation 參數設為 "conditional",這與 get() 要求的密碼金鑰自動填入功能類似。

使用者以密碼登入後,請使用「依條件建立」功能。建立作業是否成功取決於密碼管理工具和是否符合特定條件。這些條件可能因密碼管理工具而異,且可能會隨時間改變。舉例來說,在使用 Google 密碼管理工具 (GPM) 的 Chrome 中,使用者必須最近使用儲存的密碼登入該網站。

如果瀏覽器成功建立密碼金鑰,就會傳回公開金鑰憑證。將憑證傳送至後端,完成註冊程序並啟用日後的驗證功能。

特徵偵測

您可以叫用 PublicKeyCredential.getClientCapabilities(),判斷瀏覽器是否支援條件式建立功能。查看傳回的物件是否包含 conditionalCreate 屬性的 true

if (window.PublicKeyCredential && PublicKeyCredential.getClientCapabilities) {
  const capabilities = await PublicKeyCredential.getClientCapabilities();
  if (capabilities.conditionalCreate) {
    // Conditional create is available
  }
}

如果無法使用 getClientCapabilities,則無法使用條件建立功能。

依條件建立密碼金鑰

如要執行自動密碼金鑰建立作業,請使用 navigator.credentials.create() 搭配 mediation: "conditional",如下所示。

const cred = await navigator.credentials.create({
  publicKey: options,
  // Request conditional creation
  mediation: 'conditional'
});

建議您在使用者登入後立即使用自動密碼金鑰建立功能,以便盡可能符合密碼管理工具的自動建立條件。

您可以將產生的公開金鑰憑證傳送至伺服器,驗證並註冊密碼金鑰。在伺服器上確認使用者已登入。

注意事項

實作條件建立功能本身並不困難,但實際將這項功能整合至現有系統時,仍有幾項注意事項。

忽略伺服器上的使用者狀態和使用者驗證

註冊回應會將「User Presence」和「User Verified」一併傳回為 false,因此伺服器應在憑證驗證期間忽略這些旗標

在執行自動密碼金鑰建立作業前,中止目前的 WebAuthn 呼叫

如果 RP 預期使用者會使用密碼金鑰或密碼登入,執行條件式取得作業是最佳選擇。這可能會導致在執行條件建立作業前,條件取得呼叫遭到取消。

如要這麼做,您必須使用 AbortController 並呼叫 .abort()

// To abort a WebAuthn call, instantiate an AbortController.
const controller = new AbortController();

const cred = await navigator.credentials.get({
  publicKey: options,
  signal: controller.signal,
  // Request conditional get
  mediation: 'conditional'
});

// Abort the call
controller.abort();

妥善忽略例外狀況

執行條件密碼金鑰建立作業時,有幾種情況下應忽略例外狀況:

  • InvalidStateError:密碼金鑰供應器中已存在密碼金鑰 (請別忘了指定 excludeCredentials)。
  • NotAllowedError:建立密碼金鑰不符合條件。
  • AbortError:WebAuthn 呼叫已中止。

在這些情況下顯示錯誤可能會讓使用者感到困惑,因為瀏覽器會自動處理這些錯誤:只有在成功時才會顯示通知,失敗時不會觸發可見訊息。

註冊密碼金鑰失敗時的訊號

建立密碼金鑰但無法在伺服器上註冊時,使用者會嘗試登入失敗。當密碼金鑰供應器和伺服器的密碼金鑰清單不一致時,就可能發生這種情況。

為避免這種情況,請使用 Signal API 保持一致性

不支援從無密碼登入升級

此時,系統會在使用者輸入有效密碼後,才會依條件建立密碼金鑰。這表示無密碼登入方式 (例如魔法連結、電話號碼驗證或身分識別聯結) 不符合條件。

摘要

自動建立密碼金鑰可加快網站採用密碼金鑰的速度,協助網站使用者從密碼轉換為更安全的驗證方法。

如要進一步瞭解密碼金鑰,請參閱「使用密碼金鑰登入帳戶,不必輸入密碼」。