S'authentifier avec Firebase en JavaScript à l'aide d'un système d'authentification personnalisé

Vous pouvez intégrer Firebase Authentication à un système d'authentification personnalisé en modifiant votre serveur d'authentification pour qu'il produise des jetons signés personnalisés lorsqu'un utilisateur se connecte. Votre application reçoit ce jeton et l'utilise pour s'authentifier avec Firebase.

Avant de commencer

  1. Ajoutez Firebase à votre projet JavaScript.
  2. Obtenez les clés de serveur de votre projet:
    1. Accédez à la page Comptes de service dans les paramètres de votre projet.
    2. Cliquez sur Générer une nouvelle clé privée en bas de la Section SDK Admin Firebase de la page Comptes de service
    3. La paire de clés publique/privée du nouveau compte de service enregistrées sur votre ordinateur. Copiez ce fichier sur votre serveur d'authentification.

Authentifier avec Firebase

  1. Lorsque les utilisateurs se connectent à votre application, envoyez leurs identifiants de connexion (par exemple, leur nom d'utilisateur et leur mot de passe) à votre serveur d'authentification. Votre serveur vérifie les identifiants et renvoie un jeton personnalisé s'ils sont valides.
  2. Une fois que vous avez reçu le jeton personnalisé de votre serveur d'authentification, transmettez-le à signInWithCustomToken pour connecter l'utilisateur :

    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

Étapes suivantes

Lorsqu'un utilisateur se connecte pour la première fois, un compte utilisateur est créé et associés aux identifiants, c'est-à-dire au nom d'utilisateur et au mot de passe, ou des informations sur le fournisseur d'authentification, c'est-à-dire l'utilisateur avec lequel il s'est connecté. Ce nouveau compte est stocké dans votre projet Firebase et peut être utilisé pour identifier un utilisateur dans toutes les applications de votre projet, quelle que soit la manière dont il se connecte.

  • Pour connaître l'état d'authentification de vos utilisateurs dans vos applications, définissez un observateur sur l'objet Auth. Vous pouvez ensuite obtenir les informations de profil de base de l'objet User. Consultez Gérer les utilisateurs.

  • Dans vos règles de sécurité Firebase Realtime Database et Cloud Storage, vous pouvez obtenir l'ID utilisateur unique de l'utilisateur connecté à partir de la variable auth et l'utiliser pour contrôler les données auxquelles un utilisateur peut accéder.

Vous pouvez autoriser les utilisateurs à se connecter à votre application à l'aide de plusieurs fournisseurs d'authentification en associant les identifiants du fournisseur d'authentification à un compte utilisateur existant.

Pour déconnecter un utilisateur, appelez . signOut:

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