Armazenar credenciais

Armazenar e atualizar as credenciais do usuário fica fácil com a navigator.credentials.store() API.

Armazenar a credencial de um usuário

Depois que um usuário fizer login com sucesso ou alterar a senha, armazene ou atualize a credencial do usuário.

Armazenar nome de usuário e senha

Ponto-chave: Crie um novo objeto PasswordCredential e salve-o com navigator.credentials.store().

Quando o usuário fizer login e você tiver verificado suas credenciais, crie um novo objeto PasswordCredential e passe-o a navigator.credentials.store() para salvá-lo.

// After a successful sign-in, sign-up or password change,
// Instantiate a `PasswordCredential` object
var c = new PasswordCredential({
  id:       id,
  password: password,
  name:     name,
  iconrURL: iconUrl
});

// Store the credential
navigator.credentials.store(c)
.then(function() {
  // done
});
Notificação para usuário de login automático

Quando o navegador Chrome obtém as informações de credencial, uma notificação que solicita o armazenamento da credencial (ou do provedor universal) é exibida.

Armazenar nome de usuário e senha a partir de um formulário

Ponto-chave: Use um formulário bem comentado para criar um novo objeto PasswordCredential e salvá-lo com navigator.credentials.store().

Além de criar a PasswordCredential manualmente, você pode simplesmente passar um elemento form bem comentado a PasswordCredential.

Por exemplo:

<form id="form" method="post">
  <input type="text" name="id" autocomplete="username" />
  <input type="password" name="password" autocomplete="current-password" />
  <input type="hidden" name="csrf_token" value="*****" />
</form>

Em seguida, crie um novo objeto PasswordCredential passando uma referência ao elemento "form":

var form = document.querySelector('#form');
var cred = new PasswordCredential(form);
// Store it
navigator.credentials.store(cred)
.then(function() {
  // continuation
});

Todos os campos adicionais do formulário serão adicionados ao PasswordCredential como parte do parâmetro .additionalData.

Armazenar uma credencial para uma conta universal

Ponto-chave: Crie um novo objeto FederatedCredential e salve-o com navigator.credentials.store().

Para armazenar dados de conta universal, instancie um novo objeto FederatedCredential com o identificador do usuário e o do provedor. Em seguida, chame navigator.credentials.store() para armazenar a credencial.

Por exemplo:

// After a successful federation, instantiate a FederatedCredential
var cred = new FederatedCredential({
  id:       id,                           // id in IdP
  provider: 'https://account.google.com', // A string representing IdP
  name:     name,                         // name in IdP
  iconURL:  iconUrl                       // Profile image url
});

// Store it
navigator.credentials.store(cred)
.then(function() {
  // continuation
});
Parâmetros
id string
Identificador do usuário ao invocar o fluxo de autenticação específico do provedor de identidade, normalmente como um valor de login_hint no OAuth.
provider string
A serialização em ASCII da origem que o provedor usa para fazer login. Por exemplo, o Facebook seria representado por https://www.facebook.com e o Google, por https://accounts.google.com.
name string (opcional)
Fornecido pelo provedor de identidade.
iconURL string (opcional)
Fornecido pelo provedor de identidade.