FedCM 更新：Domain Hint API

Eiji Kitamura

從 Chrome 123 開始，您可以搭配使用網域提示和 Federated Credential Management API (FedCM)。使用 Domain Hint API 時，開發人員只需顯示自己接受的網域中的聯合登入帳戶，即可提供更優質的使用者體驗。

Domain Hint API

FedCM 可用於讓使用者更容易透過識別資訊提供者 (IdP) 提供的帳戶資訊，登入依賴方 (RP，也就是網站)。然而，在某些情況下，RP 會知道只有與特定網域關聯的帳戶才能登入網站，這種情況在企業情境中特別常見，因為存取的網站會限制在公司網域中。為了提供更優質的使用者體驗，FedCM API 允許 RP API 只顯示可用於登入 RP 的帳戶。這樣可以防止使用者嘗試透過公司網域外的帳戶登入 RP，但因為未使用正確的帳戶類型，而只是在稍後顯示錯誤訊息 (或關閉登入無效的情況)。

使用 Domain Hint API 時，RP 可以在 FedCM API 呼叫中指定 domainHint 屬性，只顯示使用者相符的帳戶。IdP 可以在帳戶清單端點的回應中提供 domain_hints 屬性，指出帳戶相關聯的網域。如此一來，瀏覽器就能顯示相符的帳戶，而不需要向 IdP 揭露要求的網域提示。

以下是來自帳戶清單端點的 JSON 回應範例：

{
 "accounts": [{
   "id": "1234",
   "given_name": "John",
   "name": "John Doe",
   "email": "john_doe@idp.example",
   "picture": "https://idp.example/profile/123",
   "approved_clients": ["123", "456", "789"],
  }, {
   "id": "5678",
   "given_name": "Johnny",
   "name": "Johnny",
   "email": "johnny@idp.example",
   "picture": "https://idp.example/profile/456"
   "approved_clients": ["abc", "def", "ghi"],
   "domain_hints": ["corp.example"]
  }]
}

RP 可以使用 domainHint 屬性呼叫 navigator.credentials.get()，藉此篩選帳戶。舉例來說，假設使用者造訪 corp-partner.example，並使用 corp.example 中的帳戶登入。網站叫用 API 的方式如下：

return await navigator.credentials.get({
  identity: {
    providers: [{
      configURL: "https://idp.example/manifest.json",
      clientId: "abc",
      nonce: nonce,
      domainHint : "corp.example"
    }]
  }
});

domainHint 值不會傳送至帳戶清單端點，以便進行伺服器端篩選，因為這可能會成為 IdP 的指紋向量。Chrome 會改為照常執行 FedCM 要求，並篩除不符合 navigator.credentials.get() 呼叫指定 domainHint 值的帳戶。接著，Chrome 會向使用者顯示 FedCM 對話方塊，並列出新帳戶。這個方法與 Login Hint API 類似，但這兩個 API 可以回答不同的問題。Login Hint API 的用途是回答「What is an user of the user you want?」(對我想要的 ID 是什麼？)，而「Domain Hint」(網域提示) 則負責回答「這個帳戶必須屬於哪個公司或伺服器？」。

使用 domainHint: "any" 時，Chrome 會篩除沒有任何網域的帳戶 (也就是未傳入或為空的 domain_hints)。舉例來說，在 RP 僅在註冊流程中允許代管帳戶時，就允許使用這種做法。

如果沒有符合 domainHint 的帳戶，FedCM 對話方塊會顯示登入提示，讓使用者登入與 RP 要求的提示相符的 IdP 帳戶。使用者輕觸提示時，系統會開啟彈出式視窗，其中包含設定檔中指定的登入網址。這個連結會附加登入提示和網域提示查詢參數。