Démarrez avec Firebase Authentication sur les sites Web

Vous pouvez utiliser Firebase Authentication pour permettre aux utilisateurs de se connecter à votre app en utilisant une ou plusieurs méthodes de connexion, y compris l’adresse e-mail et la connexion par mot de passe, et les fournisseurs d’identité fédérés tels que Google Sign-in et Facebook Login. Ce tutoriel vous permet de démarrer avec Firebase Authentication en vous montrant comment ajouter la signature par adresse e-mail et mot de passe à votre app.

Connecter votre app à Firebase

Installer le SDK Firebase. Assurez-vous de coller le code de configuration dans votre page Web comme décrit.

(Facultatif) Prototype et test avec Firebase Local Emulator Suite

Avant de parler de la façon dont votre app authentifie les utilisateurs, présentons un ensemble d’outils que vous pouvez utiliser pour prototyper et tester la fonctionnalité d’authentification :Firebase Local Emulator Suite. Si vous décidez parmi les techniques et les fournisseurs d’authentification, essayez différents modèles de données avec des données publiques et privées en utilisant l’authentification et les règles de sécurité Firebase, ou le prototypage des conceptions de l’interface utilisateur d’ouverture de session, être capable de travailler localement sans déployer des services en direct peut être une excellente idée.

Un émulateur d’authentification fait partie de la suite d’émulateur local, qui permet à votre app d’interagir avec le contenu et la configuration de la base de données émulée, ainsi qu’en option vos ressources de projet émulées (fonctions, autres bases de données, et règles de sécurité). Notez que la suite d’émulateur local ne supporte pas encore le stockage émulé.

L’utilisation de l’émulateur d’authentification implique seulement quelques étapes :

  1. Ajouter une ligne de code à la configuration de test de votre app pour se connecter à l’émulateur.
  2. Depuis la racine de votre répertoire de projet local, en exécutant firebase emulators:start.
  3. Utiliser l’interface utilisateur de la suite d’émulateur local pour le prototypage interactif, ou l’API REST de l’émulateur d’authentification pour les tests non interactifs.

Un guide détaillé est disponible à l’adresse Connecter votre application à l’émulateur d’authentification.Pour plus d’informations, consultez l’introduction de la suite d’émulateur local.

Poursuivons maintenant avec la façon d’authentifier les utilisateurs.

Enregistrer de nouveaux utilisateurs

Créer un formulaire qui permet aux nouveaux utilisateurs de s’inscrire à votre application en utilisant leur adresse e-mail et un mot de passe. Lorsqu’un utilisateur remplit le formulaire, validez l’adresse électronique et le mot de passe fournis par l’utilisateur, puis transmettez-les à la méthodecreateUserWithEmailAndPassword:

Enregistrement des utilisateurs existants

Créez un formulaire qui permet aux utilisateurs existants de s’enregistrer en utilisant leur adresse électronique et leur mot de passe. Lorsqu’un utilisateur remplit le formulaire, appelez la méthodesignInWithEmailAndPassword:

Set an authentication state observer and get user data

Pour chacune des pages de votre application qui ont besoin d’informations sur l’utilisateur connecté,attachez un observateur à l’objet d’authentification global. Cet observateur est appelé chaque fois que l’état de signature de l’utilisateur change.

Attachez l’observateur en utilisant la méthode onAuthStateChanged. Lorsqu’un utilisateur se connecte avec succès, vous pouvez obtenir des informations sur l’utilisateur dans l’observateur.

Apprenez à ajouter la prise en charge d’autres fournisseurs d’identité et de comptes invités anonymes :

  • Connexion Google
  • Connexion Facebook
  • Connexion Twitter
  • Connexion GitHub
  • Connexion anonyme

.

Leave a Reply