Credential Management API

Eiji Kitamura

Meggin Kearney

Credential Management API 是標準的瀏覽器 API，可在網站和瀏覽器之間提供程式輔助介面，讓使用者無論使用何種裝置，都能順暢登入。

憑證管理 API：

• 消除登入流程中的摩擦點：即使使用者的會話已過期，或是他們在其他裝置上儲存了憑證，系統仍可自動登入網站。
• 允許使用者透過帳戶選擇器輕觸登入：使用者可以在原生帳戶選擇器中選擇帳戶。
• 儲存憑證：應用程式可以儲存使用者名稱和密碼組合，甚至是聯合帳戶詳細資料。這些憑證可透過瀏覽器在各個裝置上保持同步。

想要看看實際運作情況嗎？歡迎參加 Credential Management API 示範，並參閱程式碼。

檢查憑證管理 API 的瀏覽器支援情形

使用憑證管理 API 前，請先確認是否支援 PasswordCredential 或 FederatedCredential。

if (window.PasswordCredential || window.FederatedCredential) {
  // Call navigator.credentials.get() to retrieve stored
  // PasswordCredentials or FederatedCredentials.
}

登入使用者

如要登入使用者，請從瀏覽器的密碼管理工具擷取憑證，然後用這些憑證登入使用者。

例如：

1. 如果使用者造訪您的網站，但未登入帳戶，請呼叫 navigator.credentials.get()。
2. 使用擷取的憑證登入使用者。
3. 更新 UI，指出使用者已登入。

詳情請參閱「登入使用者」一文。

儲存或更新使用者憑證

如果使用者是透過 Google 登入、Facebook、GitHub 等聯合身分提供者登入：

1. 使用者成功登入或建立帳戶後，請使用使用者的電子郵件地址做為 ID，建立 FederatedCredential，並使用 FederatedCredentials.provider 指定身分識別提供者。
2. 使用 navigator.credentials.store() 儲存憑證物件。

詳情請參閱「登入使用者」一文。

如果使用者使用使用者名稱和密碼登入：

1. 當使用者成功登入或建立帳戶後，請使用使用者 ID 和密碼建立 PasswordCredential。
2. 使用 navigator.credentials.store() 儲存憑證物件。

詳情請參閱「透過表單儲存憑證」一文。

登出

使用者登出時，請呼叫 navigator.credentials.preventSilentAccess()，避免系統自動登入。

停用自動登入功能後，使用者就能輕鬆切換帳戶，例如公司帳戶和個人帳戶，或是共用裝置上的帳戶，而無須重新輸入登入資訊。

如要瞭解詳情，請登出。

意見回饋