凭据管理 API

Eiji Kitamura
Meggin Kearney
Meggin Kearney

Credential Management API 是一个基于标准的浏览器 API，它在网站和浏览器之间提供一个编程接口以支持跨设备无缝登录。

凭据管理 API：

  • 消除登录流程中的摩擦 - 用户可以自动重新登录某个网站，即使其会话已过期或他们在其他设备上保存了凭据也是如此。
  • 允许使用账号选择器一键登录 - 用户可以在原生账号选择器中选择账号。
  • 存储凭据 - 您的应用可以存储用户名和密码的组合，甚至联合账号详情。这些凭据可以通过浏览器在设备之间同步。

想了解其实用效果？试用 Credential Management API 演示并查看代码。

检查 Credential Management API 浏览器支持情况

浏览器支持

  • Chrome：51.
  • Edge：18.
  • Firefox：60.
  • Safari：13.

来源

在使用 Credential Management API 之前，请先检查是否支持 PasswordCredential 或 FederatedCredential。

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

登录用户

如需让用户登录，请从浏览器的密码管理器检索凭据，并使用这些凭据让用户登录。

例如：

  1. 如果用户到达您的网站并且并未登录，请调用 navigator.credentials.get()。
  2. 使用检索到的凭据让用户登录。
  3. 更新界面以表明用户已登录。

如需了解详情，请参阅登录用户。

保存或更新用户凭据

如果用户通过 Google Sign-In、Facebook、GitHub 等联合身份提供程序登录：

  1. 在用户成功登录或创建账号后，使用用户的电子邮件地址作为 ID 创建 FederatedCredential，并使用 FederatedCredentials.provider 指定身份提供程序。
  2. 使用 navigator.credentials.store() 保存凭据对象。

如需了解详情，请参阅登录用户。

如果用户使用用户名和密码登录：

  1. 在用户成功登录或创建账号后，使用用户 ID 和密码创建 PasswordCredential。
  2. 使用 navigator.credentials.store() 保存凭据对象。

如需了解详情，请参阅从表单中保存凭据。

退出账号

当用户退出账号时，调用 navigator.credentials.preventSilentAccess() 以防止用户自动重新登录。

通过停用自动登录，用户还可以轻松地在账号之间切换，例如，在工作账号和个人账号之间切换，或在共享设备上的账号之间切换，无需重新输入他们的登录信息。

如需了解详情，请参阅退出账号。

反馈