凭据管理 API

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 之前,请先检查是否支持 PasswordCredentialFederatedCredential

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() 以阻止用户自动重新登录。

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

如需了解详情,请参阅退出

反馈