API Credential Management

Eiji Kitamura
Meggin Kearney
Meggin Kearney

A API Credential Management (em inglês). é uma API de navegador baseada em padrões que oferece uma interface programática entre o site e o navegador para facilitar o login em vários dispositivos.

A API Credential Management:

  • Remove o atrito dos fluxos de login: os usuários podem ser conectados de novo automaticamente a um site, mesmo que a sessão tenha expirado ou que tenham salvo credenciais em outro dispositivo.
  • Permite login com um toque no seletor de conta: os usuários podem escolher uma conta em um seletor de conta nativo.
  • Armazenar credenciais: seu aplicativo pode armazenar uma combinação de nome de usuário e senha ou até mesmo detalhes de contas federadas. Essas credenciais podem ser sincronizadas entre dispositivos pelo navegador.
.

Quer conferir o recurso em ação? Experimente o Demonstração da API Credential Management e conferir código.

Verificar o suporte ao navegador da API Credential Management

Compatibilidade com navegadores

  • Chrome: 51.
  • Borda: 18.
  • Firefox: 60.
  • Safari: 13

Origem

Antes de usar a API Credential Management, verifique se PasswordCredential ou FederatedCredential.

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

Usuário que fez login

Para fazer o login do usuário, recupere as credenciais da senha do navegador de aplicativos e usá-los para fazer login do usuário.

Exemplo:

  1. Quando um usuário acessa seu site sem fazer login, chame navigator.credentials.get().
  2. Use as credenciais recuperadas para fazer o login do usuário.
  3. Atualizar a interface para indicar que o usuário fez login.

Saiba mais em Usuários que fizeram login.

Salvar ou atualizar as credenciais do usuário

Se o usuário fez login com um provedor de identidade federado, como o Google, Login, Facebook, GitHub:

  1. Depois que o usuário fizer login ou criar uma conta, crie o FederatedCredential com o endereço de e-mail dele como o ID e especificar o provedor de identidade com FederatedCredentials.provider.
  2. Salve o objeto da credencial usando navigator.credentials.store().

Saiba mais em Usuários que fizeram login.

Se o usuário fez login com um nome de usuário e uma senha:

  1. Depois que o usuário fizer login ou criar uma conta, crie a PasswordCredential com o ID do usuário e a senha.
  2. Salve o objeto da credencial usando navigator.credentials.store().

Saiba mais em Salvar credenciais do Formulários.

Sair

Quando o usuário sair, chame navigator.credentials.preventSilentAccess(). para evitar que o usuário faça login novamente.

Desativar o login automático também permite que os usuários alternem entre contas com facilidade, por exemplo, entre contas pessoais e de trabalho, ou entre contas no dispositivos compartilhados, sem precisar inserir novamente as informações de login.

Saiba mais em Sair.

Feedback