迁移到 FedCM

本指南可帮助您了解 Federated Credentials Management API (FedCM) 为您的 Web 应用引入的变更。

启用 FedCM 后，浏览器会显示用户提示，且不使用第三方 Cookie。

概览

Privacy Sandbox for the Web 和 Chrome 从 Web 中移除第三方 Cookie 会对 Google Identity 服务和用户登录造成重大影响。

FedCM 可实现更私密的登录流程，而无需使用第三方 Cookie。浏览器会控制用户设置、显示用户提示，并且仅在征得用户明确同意后才会与 Google 等身份提供方联系。

对于大多数网站，通过对 Google Identity 服务 JavaScript 库的向后兼容更新无缝迁移。

准备工作

检查您的浏览器和浏览器版本是否支持 FedCM API，并在必要时更新到较新版本。

在屏蔽第三方 Cookie 的情况下测试登录流程之前，请打开 chrome://flags 并启用实验性 FedCmWithoutThirdPartyCookies 功能。只有在该步骤成为默认操作之前，才需要执行此步骤。此外，必须在 Chrome 中启用第三方登录设置。

迁移 Web 应用

请按照以下步骤启用 FedCM、评估迁移的潜在影响，以及根据需要对现有 Web 应用进行更改：

添加一个布尔标记，以便在初始化时启用 FedCM，如下所示：
- HTML 中，将 data-use_fedcm_for_prompt 属性设置为 true。
- JavaScript，请在 IdConfiguration 对象中将 use_fedcm_for_prompt 设置为 true。
移除 PromptMomentNotication 对象中返回的 opt_out_or_no_session 值的任何使用。

为了加强用户隐私保护，google.accounts.id.prompt 回调不再返回与用户设置或会话状态相关的结果。
更新用户流和网站代码，以处理 isDisplayMoment() 事件的延迟通知。

为了加强对用户隐私的保护，在启用 FedCM 后，系统会有意将“显示时刻”通知延迟随机时长。用户可在实际事件发生后最长 1 分钟内收到通知。使用 isDisplayMoment 有条件地显示提示或触发用户互动时，请仔细考虑用户体验设计中的可变时间长度。
从 data-prompt_parent_id 和 intermediate_iframes 中移除 position 样式属性。

浏览器会控制用户提示的大小和位置，不支持在桌面设备上一键快捷功能的自定义位置。
根据需要更新页面布局。

浏览器控制用户提示的大小和位置。根据各个页面的布局，某些内容可能会叠加。

更改页面布局，以便在重要信息被遮盖时改善用户体验。
如果您的 Web 应用从跨源 iframe 调用 One Tap API，请将 allow="identity-credentials-get" 属性添加到父框架中。

如果 iframe 的来源与父来源不完全相同，则会被视为跨源。例如：
- 不同的网域：https://example1.com 和 https://example2.com
- 不同的顶级域名：https://example.uk 和 https://example.jp
- 子网域：https://example.com 和 https://login.example.com
为了加强用户隐私保护，从跨源 iframe 调用 One Tap API 时，您必须在每个父框架 iframe 标记中添加 allow="identity-credentials-get" 属性：
```
<iframe src="https://your.cross-origin/onetap.page" allow="identity-credentials-get"></iframe>
```
如果您的应用使用的 iframe 包含另一个 iframe，您必须确保将该属性添加到每个 iframe（包括所有子 iframe）中。

例如，请考虑以下情况：
- 顶部文档 (https://www.example.uk) 包含一个名为“iframe A”的 iframe，该 iframe 嵌入了一个页面 (https://logins.example.com)。
- 这个嵌入式页面 (https://logins.example.com) 还包含一个名为“iframe B”的 iframe，它进一步嵌入了托管一键快捷功能的页面 (https://onetap.example2.com)。
为了确保“一键快捷功能”可以正确显示，必须将该属性同时添加到 iframe A 和 iframe B 代码中。
将这些指令添加到您的内容安全政策 (CSP) 中。

此步骤是可选的，因为并非所有网站都会选择定义 CSP。
取消 Accelerated Mobile Pages (AMP) 登录支持。

AMP 的用户登录支持是您的 Web 应用可能已实现的 GIS 一项可选功能。如果是这种情况，

删除对以下内容的任何引用：
- amp-onetap-google 自定义元素，以及
- <script async custom-element="amp-onetap-google" src="https://cdn.ampproject.org/v0/amp-onetap-google-0.1.js"></script>
考虑将登录请求从 AMP 重定向到您网站的 HTML 登录流程。请注意，相关的 Intermediate Iframe Support API 不受影响。