La API de Credential Management

Eiji Kitamura

Meggin Kearney

La API de Credential Management es una API para navegadores basada en estándares que brinda una interfaz programática entre el sitio y el navegador para lograr un acceso fluido en todos los dispositivos.

La API de Credential Management:

• Elimina la fricción de los flujos de acceso: Los usuarios pueden volver a acceder automáticamente a un sitio incluso si su sesión venció o si guardaron credenciales en otro dispositivo.
• Permite el acceso con un toque con el selector de cuentas: Los usuarios pueden elegir una cuenta en un selector nativo.
• Almacena credenciales: tu aplicación puede almacenar una combinación de nombre de usuario y contraseña o incluso detalles de cuentas federadas. El navegador puede sincronizar estas credenciales entre dispositivos.

¿Quieres verla en acción? Prueba la Demostración de la API de Credential Management y echa un vistazo a código.

Comprueba la compatibilidad con el navegador de la API de Credential Management

Antes de usar la API de Credential Management, verifica si PasswordCredential o FederatedCredential.

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

Usuario que accedió

Para que el usuario acceda, recupera las credenciales de la contraseña del navegador administrador y usarlos para que el usuario acceda.

Por ejemplo:

1. Cuando un usuario llega a tu sitio y no accede a su cuenta, llamar a navigator.credentials.get()
2. Usa las credenciales recuperadas para que el usuario acceda.
3. Actualiza la IU para indicar que el usuario accedió.

Más información en Usuarios que acceden.

Guarda o actualiza las credenciales de los usuarios

Si el usuario accedió con un proveedor de identidad federada, como Google Acceso, Facebook, GitHub:

1. Después de que el usuario acceda o cree una cuenta correctamente, crea FederatedCredential con la dirección de correo electrónico del usuario como el ID y especifica el proveedor de identidad con FederatedCredentials.provider.
2. Guarda el objeto de credencial usando navigator.credentials.store().

Más información en Usuarios que acceden.

Si el usuario accedió con un nombre de usuario y una contraseña:

1. Después de que el usuario acceda correctamente o cree una cuenta, crea PasswordCredential con el ID de usuario y la contraseña.
2. Guarda el objeto de credencial usando navigator.credentials.store().

Más información en Guarda credenciales de Formularios.

Salir

Cuando el usuario salga de su cuenta, llama a navigator.credentials.preventSilentAccess(). para evitar que el usuario vuelva a acceder automáticamente.

Inhabilitar el acceso automático también permite a los usuarios cambiar entre cuentas por ejemplo, entre cuentas personales y de trabajo, o entre cuentas en en dispositivos compartidos sin tener que volver a ingresar su información de acceso.

Más información en Salir.

Comentarios