Federated Credential Management API デベロッパー ガイド

FedCM を使用してプライバシー保護の ID 連携を行う方法について説明します。

FedCM（Federated Credential Management）: プライバシー保護 方法（「ログインする...」など）にアクセスする方法に関して、 ユーザーは自分の個人情報を ID サービスまたはサイトから保護できます。

FedCM のユースケース、ユーザーフロー、API ロードマップについて詳しくは、 FedCM API の概要をご覧ください。

FedCM 開発環境

Chrome の IdP と RP の両方に安全なコンテキスト（HTTPS または localhost）が必要である 使用する必要があります

Android 版 Chrome でコードをデバッグする

サーバーをローカルでセットアップして実行し、FedCM コードをデバッグする。Google Chat では このサーバーへのアクセス ポート付きの USB ケーブルで接続された Android デバイスの Chrome 使用できます。

パソコンの DevTools を使用して、Android 版 Chrome をデバッグできます。手順は次のとおりです。 Android のリモート デバッグの手順 。

Chrome でサードパーティ Cookie をブロックする

</ph>

Chrome でサードパーティ Cookie を使用しない FedCM の動作を、Chrome のリリース前にテストできます。 適用されます。

サードパーティの Cookie をブロックするには、シークレット モードを使用します。 モードを選択するか、[ブロック] を選択して 「サードパーティ Cookie」パソコンの設定（chrome://settings/cookies または以下） [設定] >サイトの設定 >Cookie。

FedCM API の使用

FedCM と統合するには、既知のファイルを作成します。 アカウントの構成ファイルとエンドポイント list、アサーションの発行、 （省略可）クライアント メタデータ。

そこから、FedCM は RP が署名に使用できる JavaScript API を公開します。 IdP に登録します。

既知のファイルを作成する

トラッカーが API を使用するには、既知のファイルは、 提供元: /.well-known/web-identity の eTLD+1 できます。

たとえば、IdP のエンドポイントがサービス プロバイダ https://accounts.idp.example/ は、既知のファイルを次の場所で提供する必要があります。 https://idp.example/.well-known/web-identity と IdP 構成 できます。次に、よく知られたファイル コンテンツの例を示します。

{
  "provider_urls": ["https://accounts.idp.example/config.json"]
}

JSON ファイルには、IdP の配列を含む provider_urls プロパティが含まれている必要があります。 構成ファイルのパス部分として指定できる navigator.credentials.get の configURL（RP 別）。商品数 配列内の URL 文字列は 1 つだけですが、実際の URL は フィードバックをお寄せください。

IdP 構成ファイルとエンドポイントを作成する

IdP 構成ファイルは、ブラウザに必要なエンドポイントのリストを提供します。IdPs この構成ファイルと必要なエンドポイントと URL がホストされます。すべての JSON レスポンスは、application/json コンテンツ タイプで送信する必要があります。

構成ファイルの URL は、モジュールに RP で実行された navigator.credentials.get 呼び出し。

const credential = await navigator.credentials.get({
  identity: {
    context: 'signup',
    providers: [{
      configURL: 'https://accounts.idp.example/config.json',
      clientId: '********',
      nonce: '******'
    }]
  }
});
const { token } = credential;

IdP 構成ファイルの場所の完全な URL を configURL として指定します。日時 RP、ブラウザで navigator.credentials.get() が呼び出される GET リクエストで構成ファイルを Origin ヘッダーや Referer ヘッダー。リクエストに Cookie が含まれておらず、リダイレクトも実行されていません。 これにより、IdP はリクエストの送信者やリクエスト元を学習できなくなります。 RP が接続を試行しています。例:

GET /config.json HTTP/1.1
Host: accounts.idp.example
Accept: application/json
Sec-Fetch-Dest: webidentity

ブラウザは、IdP から以下を含む JSON レスポンスを要求します。 プロパティ:

RP が identity.context 値を使用して FedCM ダイアログ UI の文字列を変更できた 事前定義された認証に対応する navigator.credentials.get() 学びます。省略可能なプロパティは、"signin"（デフォルト）、"signup"、 "use" または "continue"。

</ph>

IdP からのレスポンス本文の例を次に示します。

{
  "accounts_endpoint": "/accounts.php",
  "client_metadata_endpoint": "/client_metadata.php",
  "id_assertion_endpoint": "/assertion.php",
  "disconnect_endpoint": "/disconnect.php",
  "login_url": "/login",
  "branding": {
    "background_color": "green",
    "color": "#FFEEAA",
    "icons": [{
      "url": "https://idp.example/icon.ico",
      "size": 25
    }]
  }
}

構成ファイルを取得すると、ブラウザは後続のリクエストを IdP エンドポイント:

</ph>

アカウント エンドポイント

IdP のアカウント エンドポイントは、ユーザーが使用しているアカウントのリストを返します。 適用できます。IdP が複数のアカウントをサポートしている場合、 エンドポイントは、ログインしているすべてのアカウントを返します。

ブラウザが、Cookie を含む GET リクエストを送信しますが、SameSite=None は指定しません。 client_id パラメータ、Origin ヘッダー、Referer ヘッダーのいずれか。この ユーザーが署名しようとしている RP を IdP が学習できないようにします。 できます。例:

GET /accounts.php HTTP/1.1
Host: accounts.idp.example
Accept: application/json
Cookie: 0x23223
Sec-Fetch-Dest: webidentity

リクエストを受け取ったサーバーは、次のことを行います。

1. リクエストに Sec-Fetch-Dest: webidentity HTTP ヘッダーが含まれていることを確認します。
2. セッション Cookie と、すでにログインしているアカウントの ID を照合します。
3. アカウントのリストを示して回答します。

ブラウザが accounts プロパティを含む 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"],
    "login_hints": ["demo1", "demo1@idp.example"]
  }, {
    "id": "5678",
    "given_name": "Johnny",
    "name": "Johnny",
    "email": "johnny@idp.example",
    "picture": "https://idp.example/profile/456",
    "approved_clients": ["abc", "def", "ghi"],
    "login_hints": ["demo2", "demo2@idp.example"],
    "domain_hints": ["corp.example"]
  }]
}

ユーザーがログインしていない場合は、HTTP 401（Unauthorized）で応答します。

返されたアカウント リストはブラウザによって使用され、 表示されます。

クライアント メタデータ エンドポイント

IdP のクライアント メタデータ エンドポイントは、次のような証明書利用者のメタデータを返します。 RP のプライバシー ポリシーと利用規約を確認します。RP は、そのリソースへのリンクを 事前に IdP に送信する必要があります。これらのリンクは ユーザーが RP にまだ登録していない場合は、ログイン ダイアログに表示されます。 まだ作成されていません。

ブラウザが client_id を使用して GET リクエストを送信します。 navigator.credentials.get（Cookie なし）。例:

GET /client_metadata.php?client_id=1234 HTTP/1.1
Host: accounts.idp.example
Origin: https://rp.example/
Accept: application/json
Sec-Fetch-Dest: webidentity

リクエストを受け取ったサーバーは、次のことを行います。

1. client_id の RP を決めます。
2. クライアント メタデータで応答します。

クライアント メタデータ エンドポイントのプロパティは次のとおりです。

ブラウザは、エンドポイントからの JSON レスポンスを想定します。

{
  "privacy_policy_url": "https://rp.example/privacy_policy.html",
  "terms_of_service_url": "https://rp.example/terms_of_service.html",
}

返されたクライアント メタデータはブラウザによって使用され、 ルールを定義できます。

ID アサーション エンドポイント

IdP の ID アサーション エンドポイントが、ログインしているユーザーに関するアサーションを返します。 ユーザーが navigator.credentials.get() を使用して RP ウェブサイトにログインしたとき 呼び出しがあると、ブラウザはクッキーを含むPOSTリクエストを SameSite=None と application/x-www-form-urlencoded のコンテンツ タイプを このエンドポイントに、次の情報を追加します。

HTTP ヘッダーの例:

POST /assertion.php HTTP/1.1
Host: accounts.idp.example
Origin: https://rp.example/
Content-Type: application/x-www-form-urlencoded
Cookie: 0x23223
Sec-Fetch-Dest: webidentity

account_id=123&client_id=client1234&nonce=Ct60bD&disclosure_text_shown=true&is_auto_selected=true

リクエストを受け取ったサーバーは、次のことを行います。

1. CORS（クロスオリジン リソース）を使用してリクエストに応答する 共有）をご覧ください。
2. リクエストに Sec-Fetch-Dest: webidentity HTTP ヘッダーが含まれていることを確認します。
3. Origin ヘッダーを client_id によって決定される RP オリジンと照合します。 一致しない場合は拒否します。
4. account_id と、すでにログインしているアカウントの ID を照合します。次の場合に拒否 一致しません
5. トークンで応答する。リクエストが拒否された場合は、エラーを返します。 レスポンス。

トークンの発行方法は IdP によって異なりますが、通常は アカウント ID、クライアント ID、発行元、nonce などの情報を トークンが正規のものであることを RP が検証できます。

ブラウザは、次のプロパティを含む JSON レスポンスを想定しています。

{
  "token": "***********"
}

返されたトークンはブラウザによって RP に渡されるため、RP は 認証を検証します。

エラー レスポンスを返す

id_assertion_endpoint が「エラー」を返すこともあります。 次の 2 つのオプション フィールドがあります。

• code: IdP は、OAuth 2.0 指定されたエラー リスト （invalid_request、unauthorized_client、access_denied、server_error、 任意の文字列 temporarily_unavailable を使用できます。後者の場合、Chrome エラー UI に汎用エラー メッセージをレンダリングし、コードを RP に渡します。
• url: ウェブページに関する情報を含む、人が読める形式のウェブページを識別します。 エラーに関する追加情報をユーザーに提供します。このフィールド ブラウザでは詳細なエラー メッセージを出力できないため、 ネイティブ UI でサポートします。次のステップへのリンク、カスタマー サービスの連絡先など 情報などです。エラーの詳細についてお客様から問い合わせがあった場合 ブラウザ UI から対象のページにアクセスして、 詳しく見ていきますURL は IdP configURL と同じサイトのものである必要があります。

// id_assertion_endpoint response
{
  "error" : {
     "code": "access_denied",
     "url" : "https://idp.example/error?type=access_denied"
  }
}

エンドポイントの接続解除

IdentityCredential.disconnect() を呼び出すと、ブラウザはクロスオリジン SameSite=None の Cookie と次のコンテンツ タイプを含む POST リクエスト application/x-www-form-urlencoded、この切断エンドポイント、 次の情報を参照してください。

POST /disconnect.php HTTP/1.1
Host: idp.example
Origin: rp.example
Content-Type: application/x-www-form-urlencoded
Cookie: 0x123
Sec-Fetch-Dest: webidentity

account_hint=account456&client_id=rp123

リクエストを受け取ったサーバーは、次のことを行います。

1. CORS（クロスオリジン リソース）を使用してリクエストに応答する 共有）をご覧ください。
2. リクエストに Sec-Fetch-Dest: webidentity HTTP ヘッダーが含まれていることを確認します。
3. Origin ヘッダーを client_id によって決定される RP オリジンと照合します。 一致しない場合は拒否します。
4. account_hint と、すでにログインしているアカウントの ID を照合します。
5. ユーザー アカウントを RP から切断します。
6. 識別されたユーザー アカウント情報を JSON 形式で返します。 使用できます。

レスポンスの JSON ペイロードの例を次に示します。

{
  "account_id": "account456"
}

代わりに、IdP がブラウザに対して、関連付けられているすべてのアカウントの接続を解除することを望んでいる場合、 アカウント ID と一致しない文字列（"*" など）を渡します。

ログイン URL

IdP は Login Status API を使用して、 ブラウザにログインします。ただし、次のように、ステータスが同期されていない場合があります。 セッションの有効期限が切れるとき。このような場合、 ユーザーがログインページから IdP に動的にログインできるようにする idp 構成ファイルの login_url で指定された URL。

次に示すように、FedCM ダイアログにはログインを提案するメッセージが表示されます。 次の画像をご覧ください。

</ph> 。

ユーザーが [続行] ボタンをクリックすると、ブラウザでポップアップ ウィンドウが開きます。 IdP のログインページにログインします。

</ph>

このダイアログは、ファーストパーティの Cookie が設定された通常のブラウザ ウィンドウです。どちらでもない IdP が決定し、ウィンドウ ハンドルは使用できない RP ページにクロスオリジン通信リクエストを送信します。ユーザーが ログインすると、IdP は次のことを行う必要があります。

• Set-Login: logged-in ヘッダーを送信するか、 navigator.login.setStatus("logged-in") API を使用して、ブラウザに対して 表示されます。
• IdentityProvider.close() を呼び出してダイアログを閉じます。

</ph>

ID プロバイダでのユーザーのログイン ステータスをブラウザに通知する

Login Status API は ウェブサイト（特に IdP）からブラウザにユーザーのログイン ステータスを伝える 認証されます。この API を使用すると、ブラウザはブラウザへの不要なリクエストを減らすことができます。 タイミング攻撃の可能性を軽減できます。

IdP は、HTTP ヘッダーを送信してユーザーのログイン ステータスをブラウザに通知できます。 ユーザーが IdP にログインしたときや すべての IdP アカウントからログアウトされます。IdP ごとに（ID プロバイダによって識別される） 設定 URL など）に基づき、ブラウザはログイン ステータスを表すトライステート変数を保持します。 値は logged-in、logged-out、unknown です。デフォルトの状態 unknown です。

ユーザーがログインしていることを示すには、Set-Login: logged-in HTTP ヘッダーを送信します。 IdP で最上位のナビゲーションまたは同一サイトのサブリソース リクエストで origin:

Set-Login: logged-in

または、JavaScript API navigator.login.setStatus("logged-in") を呼び出します。 IdP のオリジンから設定するには、次の操作を行います。

navigator.login.setStatus("logged-in")

これらの呼び出しでは、ユーザーのログイン ステータスが logged-in として記録されます。ユーザーがログインしたとき ステータスが logged-in に設定されている場合、FedCM を呼び出している RP が IdP の FedCM アカウントで利用可能なアカウントを表示し、 クリックします。

ユーザーがすべてのアカウントからログアウトしたことを通知するには、トップレベル ナビゲーションまたは同一サイト サブリソースで Set-Login: logged-out HTTP ヘッダーを送信します。 IdP のオリジンで次の処理が行われます。

Set-Login: logged-out

または、JavaScript API navigator.login.setStatus("logged-out") を呼び出します。 IdP のオリジンから設定するには、次の操作を行います。

navigator.login.setStatus("logged-out")

これらの呼び出しでは、ユーザーのログイン ステータスが logged-out として記録されます。ユーザーが ログイン ステータスが logged-out の場合、FedCM の呼び出しは、何もせずに失敗します。 IdP のアカウント エンドポイントに送信されます。

unknown ステータスは、IdP がログイン ステータスを使用してシグナルを送信する前に設定されます。 APIUnknown が導入されたことで移行が改善されました。以下の理由があります。 IdP にログインしていました。IdP に認証情報が FedCM が最初に呼び出されるまでにブラウザにこのことを通知できる機会。この Chrome は IdP のアカウント エンドポイントにリクエストを送信し、 ステータスは、アカウント エンドポイントからのレスポンスに基づいて計算されます。

• エンドポイントから有効なアカウントのリストが返された場合は、ステータスを次のように更新します。 logged-in] をクリックし、FedCM ダイアログを開いてこれらのアカウントを表示します。
• エンドポイントからアカウントが返されない場合は、ステータスを logged-out に更新します。 失敗します。

動的ログインフローでユーザーがログインできるようにする

IdP はユーザーのログイン ステータスをブラウザに通知し続けますが、 セッションが期限切れになったときなどは、データが同期されていない可能性があります。ブラウザは、 ログイン ステータスが logged-in。ただし、セッションが終了していないため、サーバーはアカウントを返しません。 できます。そのような場合、ブラウザはユーザーのログインを動的に許可します。 ポップアップ ウィンドウで IdP に接続します。

ID プロバイダを使用して証明書利用者にログインする

IdP の設定とエンドポイントが利用可能になると、RP は navigator.credentials.get(): ユーザーに RP へのログインを許可するようリクエストします 関連付けられています

API を呼び出す前に、[FedCM が user's browser] です。FedCM が利用可能かどうかを確認するには、このコードを FedCM の実装:

if ('IdentityCredential' in window) {
  // If the feature is available, take action
}

ユーザーが RP から IdP にログインできるようにリクエストする手順は次のとおりです。 次に例を示します。

const credential = await navigator.credentials.get({
  identity: {
    providers: [{
      configURL: 'https://accounts.idp.example/config.json',
      clientId: '********',
      nonce: '******'
    }]
  }
});
const { token } = credential;

providers プロパティは、IdentityProvider の配列を取ります。 オブジェクト 次のプロパティがあります。

ブラウザによる登録とログインのユースケースの処理は、 アカウント リストのレスポンスに「approved_clients」が含まれている 提供します。ブラウザには開示情報が表示されません。 ユーザーが RP にすでに登録している場合は、「To continue with ....」というテキストを表示します。

登録の状態は、次の条件が満たされるかどうかに基づいて決定されます。 完了の有無:

• approved_clients に RP の clientId が含まれている場合。
• ユーザーがすでに RP に登録したことをブラウザが記憶している場合。

RP が navigator.credentials.get() を呼び出すと、次のアクティビティが行われます。 place:

1. ブラウザはリクエストを送信し、複数のドキュメントを取得します。 <ph type="x-smartling-placeholder">
   </ph>
   1. well-known ファイルと IdP 構成 fileエンドポイントを宣言します
   2. アカウント リスト。
   3. 省略可: RP のプライバシー ポリシーと利用規約の URL クライアント メタデータ エンドポイントから取得します。
2. ブラウザには、ユーザーがログインに使用できるアカウントのリストが表示されます。 利用規約とプライバシーポリシー（ある場合）
3. ユーザーがログインに使用するアカウントを選択すると、ID へのリクエストが アサーション エンドポイントが IdP に送信され、 あります。
4. RP は、ユーザーを認証するためにトークンを検証できます。

</ph>

RP は FedCM に対応していないブラウザをサポートすることが前提となっているため、 FedCM 以外の既存のログイン プロセスをユーザーが使用できるようにする必要があります。終了 サードパーティ Cookie は完全に廃止され、今後も廃止される見込み 問題ではありません。

トークンが RP サーバーによって検証されると、RP はユーザーまたは そのユーザーはログインして新しいセッションを開始できます。

Login Hint API

ユーザーがログインした後、証明書利用者（RP）がユーザーに 再認証する必要があります。ただし、ユーザーはどのアカウントを使っているかわからない可能性があります。 ログインに使用するアカウントを RP で指定できると、 アカウントを選択します。

RP は、次の呼び出しによって特定のアカウントを選択的に表示できます。 navigator.credentials.get() は、loginHint プロパティのいずれか login_hints アカウントの一覧から取得した値 を使用します。

return await navigator.credentials.get({
  identity: {
    providers: [{
      configURL: "https://idp.example/manifest.json",
      clientId: "123",
      nonce: nonce,
      loginHint : "demo1@example.com"
    }]
  }
});

loginHint に一致するアカウントがない場合、FedCM ダイアログにログイン プロンプトが表示されます。 これにより、ユーザーは、によって要求されたヒントに一致する IdP アカウントにログインできます。 表示されます。ユーザーがプロンプトをタップすると、ポップアップ ウィンドウが開いて 構成ファイルで指定されたログイン URL。リンクが ログインヒントとドメインヒントのクエリ パラメータが追加されていることがわかります。

Domain Hint API

関連付けられたアカウントのみが サイトへのログインが特定のドメインで許可されるようにします。これは特に アクセス対象のサイトにアクセスできるのが企業に限定されている場合のエンタープライズ シナリオ できます。ユーザー エクスペリエンスを提供するため、FedCM API では RP が RP へのログインに使用できるアカウントが表示されます。これにより ユーザーが会社以外のアカウントを使用して RP にログインしようとした 後でエラー メッセージとともにメッセージが表示される（または、 正しい種類のアカウントが使用されなかったため、ログインできませんでした）を報告しました。

RP は、次の呼び出しを行うことで、一致するアカウントのみを選択的に表示できます。 navigator.credentials.get() は、domainHint プロパティのいずれか domain_hints アカウントの一覧から取得した値 を使用します。

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

domainHint に一致するアカウントがない場合、FedCM ダイアログにログイン プロンプトが表示されます。 これにより、ユーザーは、によって要求されたヒントに一致する IdP アカウントにログインできます。 表示されます。ユーザーがプロンプトをタップすると、ポップアップ ウィンドウが開いて 構成ファイルで指定されたログイン URL。リンクが ログインヒントとドメインヒントのクエリ パラメータが追加されていることがわかります。

</ph>

エラー メッセージを表示する

場合によっては、次のような正当な理由で IdP がトークンを発行できないことがあります。 サーバーが一時的に利用できなくなる場合があります。条件 IdP から「エラー」が返されるChrome に加えて RP もそれを捕捉できます。 ブラウザ UI を表示して、ユーザーに通知します。 設定します。

</ph>

try {
  const cred = await navigator.credentials.get({
    identity: {
      providers: [
        {
          configURL: "https://idp.example/manifest.json",
          clientId: "1234",
        },
      ],
    }
  });
} catch (e) {
  const code = e.code;
  const url = e.url;
}

初期認証後にユーザーを自動的に再認証する

FedCM 自動再認証 （略して「auto-reauthn」）では、ユーザーがログインしたときに、 初期認証後に再度アクセスします。「最初の であるユーザーがアカウントを作成するか RP にログインすることを意味します。 FedCM のログイン ダイアログで [Continue as...] ボタンをタップして、ウェブサイト 実行されている場合があります

明示的なユーザー エクスペリエンスは、ユーザーが トラッキングを防止するための連携アカウント（FedCM の主な目標の一つです） ユーザーが一度やり終わった後、 ユーザーが RP と IdP 間の通信を許可する権限を付与する。 別の明示的なユーザーに強制適用しても、プライバシーとセキュリティ上のメリットはない 確認することもできます。

自動再認証では、ユーザーが指定したオプションに応じてブラウザの動作が変わります。 navigator.credentials.get() を呼び出すときに mediation に指定します。

const cred = await navigator.credentials.get({
  identity: {
    providers: [{
      configURL: "https://idp.example/fedcm.json",
      clientId: "1234",
    }],
  },
  mediation: 'optional', // this is the default
});

// `isAutoSelected` is `true` if auto-reauthn was performed.
const isAutoSelected = cred.isAutoSelected;

mediation は、Credential Management API のプロパティです。 API、 動作は同じです。 方法 同様 PasswordCredential および FederatedCredential 一部は Google Cloud によって PublicKeyCredential できます。このプロパティには、次の 4 つの値を指定できます。

• 'optional'（デフォルト）: 可能であれば自動再認証を行います。そうでない場合はメディエーションが必要です。水 ログインページでこのオプションを選択することをおすすめします。
• 'required': 続行するためにメディエーションを常に必要とする（例: 「続行して」クリックします。このオプションは、 権限を明示的に付与する必要があります。
• 'silent': 可能であれば自動再認証。認証を要求せずに通知なく失敗します。 調整する必要がありますこのオプションは、 ログインしたままにしたい場合は、専用のログインページ 例: 配送ウェブサイトの商品ページ、ニュースの記事ページ 確認できます
• 'conditional': WebAuthn に使用され、現時点では FedCM では利用できません。

この呼び出しでは、次の条件下で自動再認証が行われます。

• FedCM を利用できます。たとえば、ユーザーが FedCM を無効にしていないことなど） または設定内の RP に対して適用されます。
• ユーザーは、このウェブサイトへのログインに FedCM API を持つアカウントを 1 つだけ使用した できます。
• ユーザーはそのアカウントを使用して IdP にログインしています。
• 自動再認証が過去 10 分以内に行われていません。
• RP が電話をかけていない 試用期間の終了後は navigator.credentials.preventSilentAccess() 確認できます。

これらの条件が満たされると、 FedCM navigator.credentials.get() が呼び出されるとすぐにユーザーが起動します。

mediation: optional の場合、自動再認証は 利用できないため、 ブラウザのみが認識できます。RP は、自動再認証が実行されたかどうかを isAutoSelected プロパティを調べます。

これは、API のパフォーマンスを評価し、それに応じて UX を改善するのに役立ちます。 また、利用できない場合、ユーザーはサービス アカウントの明示的な ユーザー メディエーション（mediation: required を含むフロー）

preventSilentAccess() を使用してメディエーションを適用する

ログアウトした直後にユーザーの自動再認証を行っても、 非常に優れたユーザーエクスペリエンスですそのため FedCM では 自動再認証を設定することで、この動作を防ぐことができます。自動再認証が行われると 10 分に 1 回までです。ただし、ユーザーが次の時間内に再度ログインする場合を除きます。 10 分。RP は navigator.credentials.preventSilentAccess() を呼び出して、 ユーザーがログアウトしたときに自動再認証を無効にするよう、ブラウザで明示的に要求する ログアウト ボタンをクリックするなどして、明示的に RP にアタッチする必要があります。

function signout() {
  navigator.credentials.preventSilentAccess();
  location.href = '/signout';
}

ユーザーは設定で自動再認証をオプトアウトできる

ユーザーは設定メニューから自動再認証を無効にできます。

• パソコンの Chrome: chrome://password-manager/settings >ログイン 自動的に適用されます。
• Android Chrome で [設定] を開きます >パスワード マネージャー >アプリ をクリックする >自動ログイン。

切り替えを無効にすると、ユーザーは自動再認証動作を無効にできます。 説明します。ユーザーが以下の操作を行った場合、この設定はデバイス間で保存、同期されます。 Google アカウントにログインしてから同期を実行することで、 有効にします。

RP から IdP を切断する

ユーザーが以前に FedCM から IdP を使用して RP にログインしたことがある場合は、 ブラウザによってローカルに記憶され、 できます。RP は、 IdentityCredential.disconnect() 関数を使用します。この関数は 使用しないでください。RP は、configURL（使用する clientId）を渡す必要があります。 IdP の IP アドレス、IdP の接続を解除するための accountHint です。アカウント ヒントには、切断エンドポイントが識別できる任意の文字列にできます メールアドレスやユーザー ID などは必須ではないが、 アカウント リスト エンドポイントから提供されたアカウント ID と一致する必要があります。

// Disconnect an IdP account "account456" from the RP "https://idp.com/". This is invoked on the RP domain.
IdentityCredential.disconnect({
  configURL: "https://idp.com/config.json",
  clientId: "rp123",
  accountHint: "account456"
});

IdentityCredential.disconnect() は Promise を返します。この Promise により 次の理由により例外となります。

• ユーザーが FedCM の IdP を使用して RP にログインしていない。
• API は、FedCM 権限ポリシーのない iframe 内から呼び出されます。
• configURL が無効か、切断エンドポイントがありません。
• コンテンツ セキュリティ ポリシー（CSP）のチェックに失敗する
• 保留中の接続解除リクエストがあります。
• ユーザーがブラウザの設定で FedCM を無効にしている。

IdP の切断エンドポイントが レスポンスが完了すると、RP と IdP はネットワークで切断されます。 Promise が解決されます。切断されたアカウントの ID は （接続解除からのレスポンスで指定） 提供します。

クロスオリジン iframe 内から FedCM を呼び出す

FedCM は、クロスオリジンの iframe 内から呼び出すことができます。 identity-credentials-get 権限ポリシー（親フレームで許可されている場合）。宛先 iframe タグに allow="identity-credentials-get" 属性を追加します。 次のとおりです。

<iframe src="https://fedcm-cross-origin-iframe.glitch.me" allow="identity-credentials-get"></iframe>

実際の動作は、こちらで確認できます。

（省略可）親フレームが FedCM を呼び出すオリジンを制限する場合、 許可されたオリジンのリストを含む Permissions-Policy ヘッダーを送信する。

Permissions-Policy: identity-credentials-get=(self "https://fedcm-cross-origin-iframe.glitch.me")

権限ポリシーの仕組みについて詳しくは、管理 権限のあるブラウザ機能 ポリシーをご覧ください。