Authentifiez-vous auprès de Firebase à l'aide de comptes basés sur un mot de passe à l'aide de Javascript

Vous pouvez utiliser Firebase Authentication pour permettre à vos utilisateurs de s'authentifier auprès de Firebase à l'aide de leurs adresses e-mail et mots de passe, et pour gérer les comptes basés sur mot de passe de votre application.

Avant que tu commences

  1. Ajoutez Firebase à votre projet JavaScript .
  2. Si vous n'avez pas encore connecté votre application à votre projet Firebase, faites-le depuis la console Firebase .
  3. Activer la connexion par e-mail/mot de passe :
    1. Dans la console Firebase , ouvrez la section Auth .
    2. Dans l'onglet Méthode de connexion , activez la méthode de connexion par e-mail/mot de passe et cliquez sur Enregistrer .

Créer un compte basé sur un mot de passe

Pour créer un nouveau compte utilisateur avec un mot de passe, procédez comme suit sur la page d'inscription de votre application :

  1. Lorsqu'un nouvel utilisateur s'inscrit à l'aide du formulaire d'inscription de votre application, effectuez toutes les étapes de validation de nouveau compte requises par votre application, telles que la vérification que le mot de passe du nouveau compte a été correctement saisi et répond à vos exigences de complexité.
  2. Créez un nouveau compte en transmettant l'adresse e-mail et le mot de passe du nouvel utilisateur à createUserWithEmailAndPassword :

    Web modular API

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

const auth = getAuth();
createUserWithEmailAndPassword(auth, email, password)
  .then((userCredential) => {
    // Signed in 
    const user = userCredential.user;
    // ...
  })
  .catch((error) => {
    const errorCode = error.code;
    const errorMessage = error.message;
    // ..
  });
    auth_signup_password.js

    Web namespaced API

    firebase.auth().createUserWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in 
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ..
  });
    email.js
    Si le nouveau compte a été créé, l'utilisateur est automatiquement connecté. Consultez la section Étapes suivantes ci-dessous pour obtenir les détails de l'utilisateur connecté.

    C'est également là que vous pouvez détecter et gérer les erreurs. Pour une liste des codes d'erreur, consultez la documentation de référence Auth .

Connectez un utilisateur avec une adresse e-mail et un mot de passe

Les étapes de connexion d'un utilisateur avec un mot de passe sont similaires aux étapes de création d'un nouveau compte. Sur la page de connexion de votre application, procédez comme suit :

  1. Lorsqu'un utilisateur se connecte à votre application, transmettez l'adresse e-mail et le mot de passe de l'utilisateur à signInWithEmailAndPassword :

    Web modular API

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

const auth = getAuth();
signInWithEmailAndPassword(auth, email, password)
  .then((userCredential) => {
    // Signed in 
    const user = userCredential.user;
    // ...
  })
  .catch((error) => {
    const errorCode = error.code;
    const errorMessage = error.message;
  });
    auth_signin_password.js

    Web namespaced API

    firebase.auth().signInWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
  });
    email.js
    Consultez la section Étapes suivantes ci-dessous pour obtenir les détails de l'utilisateur connecté.

    C'est également là que vous pouvez détecter et gérer les erreurs. Pour une liste des codes d'erreur, consultez la documentation de référence Auth .

Recommandé : Activer la protection de l'énumération des e-mails

Certaines méthodes d'authentification Firebase qui prennent les adresses e-mail comme paramètres génèrent des erreurs spécifiques si l'adresse e-mail n'est pas enregistrée lorsqu'elle doit être enregistrée (par exemple, lors de la connexion avec une adresse e-mail et un mot de passe), ou enregistrée lorsqu'elle doit être inutilisée (par exemple, lors de la modification de l'adresse e-mail d'un utilisateur). Bien que cela puisse être utile pour suggérer des remèdes spécifiques aux utilisateurs, il peut également être utilisé abusivement par des acteurs malveillants pour découvrir les adresses e-mail enregistrées par vos utilisateurs.

Pour atténuer ce risque, nous vous recommandons d'activer la protection par énumération des e-mails pour votre projet à l'aide de l'outil Google Cloud gcloud . Notez que l'activation de cette fonctionnalité modifie le comportement de signalement d'erreurs de Firebase Authentication : assurez-vous que votre application ne s'appuie pas sur des erreurs plus spécifiques.

Prochaines étapes

Lorsqu'un utilisateur se connecte pour la première fois, un nouveau compte d'utilisateur est créé et lié aux informations d'identification (c'est-à-dire le nom d'utilisateur et le mot de passe, le numéro de téléphone ou les informations du fournisseur d'authentification) avec lesquelles l'utilisateur s'est connecté. Ce nouveau compte est stocké dans le cadre de votre projet Firebase et peut être utilisé pour identifier un utilisateur dans chaque application de votre projet, quelle que soit la manière dont l'utilisateur se connecte.

  • Dans vos applications, la méthode recommandée pour connaître le statut d'authentification de votre utilisateur consiste à définir un observateur sur l'objet Auth . Vous pouvez ensuite obtenir les informations de base du profil de l'utilisateur à partir de l'objet User . Voir 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 liant les informations d'identification du fournisseur d'authentification à un compte d'utilisateur existant.

Pour déconnecter un utilisateur, appelez signOut :

Web modular API

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 namespaced API

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