Autentica con Firebase en JavaScript mediante un sistema de autenticación personalizado

Puedes integrar Firebase Authentication con un sistema de autenticación personalizado. Para ello, cambia el servidor de autenticación a fin de que genere tokens firmados personalizados cuando un usuario acceda de forma correcta. La app recibe este token y lo usa para autenticar con Firebase.

Antes de comenzar

  1. Agrega Firebase a tu proyecto de JavaScript.
  2. Obtén las claves del servidor del proyecto:
    1. Ve a la página Cuentas de servicio en la configuración del proyecto.
    2. Haz clic en Generar nueva clave privada en la parte inferior de la sección SDK de Firebase Admin de la página Cuentas de servicio.
    3. El par de clave pública/privada de la cuenta de servicio nueva se guarda de manera automática en la computadora. Copia este archivo en el servidor de autenticación.

Autentica con Firebase

  1. Cuando los usuarios acceden a tu app, envía sus credenciales de acceso (por ejemplo, el nombre de usuario y la contraseña) a tu servidor de autenticación. Tu servidor verifica las credenciales y muestra un token personalizado si son válidas.
  2. Después de recibir el token personalizado de tu servidor de autenticación, pásalo a signInWithCustomToken para que el usuario acceda:

    Web

    import { getAuth, signInWithCustomToken } from "firebase/auth";

const auth = getAuth();
signInWithCustomToken(auth, token)
  .then((userCredential) => {
    // Signed in
    const user = userCredential.user;
    // ...
  })
  .catch((error) => {
    const errorCode = error.code;
    const errorMessage = error.message;
    // ...
  });
    auth_sign_in_custom.js

    Web

    firebase.auth().signInWithCustomToken(token)
  .then((userCredential) => {
    // Signed in
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ...
  });
    custom.js

Próximos pasos

Cuando un usuario accede por primera vez, se crea una cuenta de usuario nueva y se la vincula con las credenciales (el nombre de usuario y la contraseña, el número de teléfono o la información del proveedor de autenticación) que el usuario utilizó para acceder. Esta cuenta nueva se almacena como parte de tu proyecto de Firebase y se puede usar para identificar a un usuario en todas las apps del proyecto, sin importar cómo acceda.

  • En tus apps, para conocer el estado de autenticación del usuario, te recomendamos configurar un observador en el objeto Auth. Luego podrás obtener la información de perfil básica del usuario a partir del objeto User. Consulta Administra usuarios en Firebase.

  • En tus Reglas de seguridad de Firebase Realtime Database y Cloud Storage, puedes obtener el ID del usuario único que accedió a partir de la variable auth y usarlo para controlar a qué datos podrá acceder.

Para permitir que los usuarios accedan a tu app mediante varios proveedores de autenticación, puedes vincular las credenciales de estos proveedores con una cuenta de usuario existente.

Para salir de la sesión de un usuario, llama a signOut de la siguiente manera:

Web

import { getAuth, signOut } from "firebase/auth";

const auth = getAuth();
signOut(auth).then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});
auth_sign_out.js

Web

firebase.auth().signOut().then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});
index.js