自动“继续为”Google 弹出窗口的文档

Question

如何在我的网站上获得自动“使用 Google 登录”框架之一？例如，如果您登录帐户并访问 Kayak.com，就会发生这种情况。任何documentation I come across 都用于较旧的“使用 Google 登录”按钮。

这就是访问 Kayak.com 的样子。

Answer 1

编辑（2020 年 10 月 29 日）：

第一个链接现在又可以工作了（正如@ManSamVampire 指出的那样）：

https://developers.google.com/identity/one-tap/web

编辑（2019 年 11 月 9 日）：

现在链接似乎指向 404。我找不到任何有关 One Tap 登录消失的信息。

原答案：

我有同样的问题，发现了这个（我用谷歌搜索了“谷歌自动登录”）：

https://developers.google.com/identity/one-tap/web/

他们的屏幕截图是针对移动设备的，但弹出窗口看起来与您在其他网络应用上看到的完全一样。

如果您单击 Guides 选项卡，您应该会在那里找到一些文档，包括 Getting Started 部分：

https://developers.google.com/identity/one-tap/web/get-started

这将向您展示如何像设置任何其他 Google API（例如 Maps JavaScript API）一样设置凭据。

获得凭据后，您可以在主 HTML 文件或加载其他脚本的任何位置从 Google 加载库（如果有）：

<script src="https://smartlock.google.com/client"></script>

然后您应该能够通过 googleyolo 对象访问该库：

window.onGoogleYoloLoad = (googleyolo) => {
  // The 'googleyolo' object is ready for use.
};

您在该屏幕截图中看到的（以及我也看到的）看起来是一个googleyolo.hint() 调用。

这似乎取决于用户是否已经登录该站点。如果他们有或如果他们在浏览器中保存了该网站的密码，那么它应该自动登录或至少提示输入密码。除了使用前面提到的googleyolo.hint() 调用的登录之外，此 API 还处理注册。

可以在指南页面上找到更详细的代码示例。

您还需要控制此站点的后端，以通过成功的 googleyolo.hint() 或 googleyolo.retrieve() 调用验证 ID 令牌 的完整性。 https://developers.google.com/identity/one-tap/web/idtoken-auth 对此进行了介绍。