Premiers pas avec l'authentification Firebase sur Flutter

Connectez votre application à Firebase

Installez et initialisez les SDK Firebase pour Flutter si vous ne l'avez pas déjà fait.

Ajoutez l'authentification Firebase à votre application

  1. Depuis la racine de votre projet Flutter, exécutez la commande suivante pour installer le plugin :

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

    flutter run
    
  3. Importez le plugin 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 Méthode de connexion dans la section Authentification Firebase pour activer la connexion par e-mail/mot de passe et tout autre fournisseur d'identité souhaité pour votre application.

(Facultatif) Prototyper et tester avec Firebase Local Emulator Suite

Avant de parler de la façon dont votre application 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 choisissez parmi des techniques et des fournisseurs d'authentification, essayez différents modèles de données avec des données publiques et privées à l'aide des règles d'authentification et de sécurité Firebase, ou prototypage de conceptions d'interface utilisateur de connexion, pouvoir travailler localement sans déployer de services en direct peut être une excellente idée. .

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

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

  1. Ajout d'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. Utilisation de l’interface utilisateur de Local Emulator Suite pour le prototypage interactif ou de l’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);
    //...
    }
    

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

Passons maintenant à la façon d'authentifier les 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 dans votre application Flutter nouvelle ou existante. Dans de nombreux cas, vous aurez besoin de 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 sur l'état d'authentification actuel de l'utilisateur, puis fournit des événements ultérieurs chaque fois que l'état d'authentification change.

Il existe trois méthodes pour écouter les changements d'é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 :

  • Juste après que l'auditeur ait été enregistré.
  • 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 :

  • Juste après que l'auditeur ait été enregistré.
  • Lorsqu'un utilisateur est connecté.
  • Lorsque l'utilisateur actuel est déconnecté.
  • Lorsqu'il y a un changement dans le jeton de l'utilisateur actuel.

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 lorsque les événements suivants se produisent :

  • Juste après que l'auditeur ait été enregistré.
  • Lorsqu'un utilisateur est connecté.
  • Lorsque l'utilisateur actuel est déconnecté.
  • Lorsqu'il y a un changement dans le jeton de l'utilisateur actuel.
  • Lorsque les méthodes suivantes fournies par FirebaseAuth.instance.currentUser sont appelées :
    • reload()
    • unlink()
    • updateEmail()
    • updatePassword()
    • updatePhoneNumber()
    • updateProfile()

État d'authentification persistant

Les SDK Firebase pour toutes les plates-formes fournissent une prise en charge prête à l'emploi pour garantir que l'état d'authentification de votre utilisateur est conservé lors des redémarrages d'applications ou des rechargements de pages.

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

Sur les plateformes Web, l'état d'authentification de l'utilisateur est stocké dans IndexedDB . Vous pouvez modifier la persistance pour stocker les données dans le stockage local à l'aide de Persistence.LOCAL . Si nécessaire, vous pouvez modifier ce comportement par défaut pour conserver uniquement l'état d'authentification pour la session en cours, ou pas du tout. Pour configurer ces paramètres, appelez la méthode suivante FirebaseAuth.instanceFor(app: Firebase.app(), persistence: Persistence.LOCAL); . Vous pouvez toujours mettre à jour la persistance pour chaque instance d'authentification à 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);

Prochaines étapes

Explorez les guides sur la connexion et l'inscription des utilisateurs avec les services d'identité et d'authentification pris en charge.