Premiers pas avec Firebase Authentication sur Flutter

Connecter votre application à Firebase

Installez et initialisez les SDK Firebase pour Flutter si ce n'est pas déjà fait. donc.

Ajouter Firebase Authentication à votre application

  1. À la racine de votre projet Flutter, exécutez la commande suivante pour installer le plug-in:

    flutter pub add firebase_auth
    
  2. Une fois cette étape terminée, reconstruisez votre application Flutter :

    flutter run
    
  3. Importez le plug-in dans votre code Dart :

    import 'package:firebase_auth/firebase_auth.dart';
    

Pour utiliser un fournisseur d'authentification, vous devez l'activer dans la console Firebase. Accédez à la page "Mode de connexion" de la section "Firebase Authentication" pour activer Connexion par adresse e-mail/mot de passe et autres fournisseurs d'identité de votre choix pour votre application.

(Facultatif) Prototyper et tester avec la suite d'émulateurs locaux Firebase

Avant de parler de la façon dont votre application authentifie les utilisateurs, présentons un ensemble d'outils que vous pouvez utiliser pour créer des prototypes et tester la fonctionnalité d'authentification : la suite d'émulateurs locaux Firebase. Si vous choisissez entre des techniques et des fournisseurs d'authentification, que vous testez différents modèles de données avec des données publiques et privées à l'aide d'Authentication et des règles de sécurité Firebase, ou que vous effectuez un prototypage de conceptions d'UI de connexion, il peut être judicieux de pouvoir travailler en local sans déployer de services en ligne.

L'émulateur d'authentification fait partie de la suite d'émulateurs locaux, qui permet à votre application d'interagir avec le contenu et la configuration de la base de données émulée, et éventuellement les ressources de projet émulées (fonctions, autres bases de données, et règles de sécurité).

L'utilisation de l'émulateur Authentication ne nécessite que quelques étapes:

  1. Ajoutez une ligne de code à la configuration de test de votre application pour vous connecter à l'émulateur.

  2. À partir de la racine du répertoire de votre projet local, exécutez firebase emulators:start.

  3. Utiliser l'interface utilisateur de la suite d'émulateurs locaux pour le prototypage interactif, ou la API REST de l'émulateur d'authentification pour les tests non interactifs.

  4. Appelez useAuthEmulator() pour spécifier l'adresse et le port de l'émulateur:

    Future<void> main() async {
    WidgetsFlutterBinding.ensureInitialized();
    await Firebase.initializeApp();
    
    // Ideal time to initialize
    await FirebaseAuth.instance.useAuthEmulator('localhost', 9099);
    //...
    }
    

Pour en savoir plus, consultez le guide détaillé Connecter votre application à l'émulateur d'authentification. Pour en savoir plus, consultez la présentation de la suite d'émulateurs locaux.

Passons maintenant à l'authentification des utilisateurs.

Vérifier l'état d'authentification actuel

Firebase Auth fournit de nombreuses méthodes et utilitaires pour vous permettre d'intégrer une authentification sécurisée à votre application Flutter nouvelle ou existante. Dans de nombreuses vous devez connaître l'état d'authentification de votre utilisateur. par exemple, s'il est connecté ou déconnecté.

Firebase Auth vous permet de vous abonner en temps réel à cet état via un Stream Une fois appelé, le flux fournit un événement immédiat concernant l'événement l'état d'authentification, puis fournit les événements suivants chaque fois que l'état d'authentification change.

Il existe trois méthodes pour écouter les modifications de l'état d'authentification :

authStateChanges()

Pour vous abonner à ces modifications, appelez la méthode authStateChanges() sur votre Instance FirebaseAuth:

FirebaseAuth.instance
  .authStateChanges()
  .listen((User? user) {
    if (user == null) {
      print('User is currently signed out!');
    } else {
      print('User is signed in!');
    }
  });

Les événements sont déclenchés lorsque les événements suivants se produisent :

  • Immédiatement après l'enregistrement de l'écouteur.
  • Lorsqu'un utilisateur est connecté.
  • Lorsque l'utilisateur actuel est déconnecté.

idTokenChanges()

Pour vous abonner à ces modifications, appelez la méthode idTokenChanges() sur votre Instance FirebaseAuth:

FirebaseAuth.instance
  .idTokenChanges()
  .listen((User? user) {
    if (user == null) {
      print('User is currently signed out!');
    } else {
      print('User is signed in!');
    }
  });

Les événements sont déclenchés lorsque les événements suivants se produisent :

  • Immédiatement après l'enregistrement de l'écouteur.
  • Lorsqu'un utilisateur est connecté.
  • Lorsque l'utilisateur actuel est déconnecté.
  • En cas de modification du jeton de l'utilisateur actuel.

<ph type="x-smartling-placeholder">

userChanges()

Pour vous abonner à ces modifications, appelez la méthode userChanges() sur votre Instance FirebaseAuth:

FirebaseAuth.instance
  .userChanges()
  .listen((User? user) {
    if (user == null) {
      print('User is currently signed out!');
    } else {
      print('User is signed in!');
    }
  });

Les événements sont déclenchés dans les cas suivants:

  • Immédiatement après l'enregistrement de l'écouteur.
  • Lorsqu'un utilisateur est connecté.
  • Lorsque l'utilisateur actuel est déconnecté.
  • En cas de modification du jeton de l'utilisateur actuel.
  • Lorsque les méthodes suivantes fournies par FirebaseAuth.instance.currentUser sont appelées:
    • reload()
    • unlink()
    • updateEmail()
    • updatePassword()
    • updatePhoneNumber()
    • updateProfile()

<ph type="x-smartling-placeholder">

Conserver l'état d'authentification

Les SDK Firebase pour toutes les plates-formes sont compatibles dès la sortie de la boîte pour vous assurer que l'état d'authentification de votre utilisateur est conservé lors des redémarrages de l'application ou des rechargements de page.

Sur les plates-formes natives telles qu'Android et iOS, ce comportement n'est pas configurable, et l'état d'authentification de l'utilisateur est conservé sur l'appareil entre les redémarrages de l'application. L'utilisateur peut effacer les données mises en cache des applications dans les paramètres de l'appareil, ce qui effacera tout état existant stocké.

Sur les plates-formes Web, l'état d'authentification de l'utilisateur est stocké dans IndexedDB. Vous pouvez modifier la persistance pour stocker les données dans l'espace de stockage local avec Persistence.LOCAL. Si nécessaire, vous pouvez modifier ce comportement par défaut pour ne conserver l'état d'authentification que pour la session en cours, ou pas du tout. Pour configurer ces paramètres, appelez la méthode FirebaseAuth.instanceFor(app: Firebase.app(), persistence: Persistence.LOCAL); suivante. Vous pouvez toujours mettre à jour la persistance pour chaque instance Auth à l'aide de setPersistence(Persistence.NONE).

// Disable persistence on web platforms. Must be called on initialization:
final auth = FirebaseAuth.instanceFor(app: Firebase.app(), persistence: Persistence.NONE);
// To change it after initialization, use `setPersistence()`:
await auth.setPersistence(Persistence.LOCAL);

Étapes suivantes

Consultez les guides sur la connexion et l'inscription des utilisateurs avec les services d'identité et d'authentification compatibles.