Le composant Session Firebase

Le composant Session Firebase vous permet de gérer les connexions et les sessions utilisateur dans votre application PandaSuite. Avec ce composant, vous pouvez facilement intégrer l’authentification Firebase et associer des données spécifiques à chaque utilisateur, comme un score, une progression ou un type d’accès.

Ce composant peut être utilisé avec ou sans interface utilisateur selon vos besoins.

Activer l'authentification via Firebase

Firebase est la plateforme mobile de Google qui permet la création d'un backend scalable et performant, dédiée principalement aux applications mobiles. Le backend représente la partie serveur de l'application qui gère des responsabilités comme l'authentification, le stockage, les notifications, etc...

Activer la connexion Email / Mot de passe

Ajoutez une méthode d'authentification pour votre application.

• Rendez-vous dans Authentication et cliquez sur Commencer.
• Dans l'onglet Sign-in method, sélectionnez Adresse email/Mot de passe et cliquez sur Activer.

Vous avez désormais une procédure d'authentification via adresse e-mail et mot de passe. 

Configurer Cloud Firestore

Cloud Firestore est une base de données spécifiques à Firebase. Elle vous permet notamment d'associer des données à vos utilisateurs. 

• Rendez-vous dans l'onglet Firestore Database. Cliquez sur Créer une base de données.

• Choisissez le mode Commencer en mode test.

• Rendez-vous dans l'onglet Règles : il vous faut mettre à jour les règles de sécurité afin de ne pas être bloqué après 30 jours. Copiez-collez le code ci-dessous :

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /users/{userId} {
      allow read, write: if request.auth.uid == userId
    }
  }
}

Votre configuration Cloud Firestore est prête.

Insérer le composant Session Firebase

Cliquez sur Composants et choisissez Session Firebase. Pour que le composant soit accessible dans toute l'application, insérez-le au niveau du projet.

Dans les propriétés, copiez/collez l' ID du projet et la Clé API depuis la console Firebase. 

Ces informations sont accessibles depuis les Paramètres du projet sur Firebase.

Forcer l'authentification après (heures) 

Cette option indique le nombre d'heures (après l'identification) pendant lesquelles la session reste valide, même sans connexion internet. Au-delà de ce nombre d'heures, une connexion internet sera nécessaire pour continuer. Lorsque la session est toujours valide, l'utilisateur n'aura pas besoin de se reconnecter. Par défaut, la valeur 0 crée une session infinie.

Déclencher une action si l'utilisateur est connecté ou non

Pour déclencher une action en fonction de l'état de la session, sélectionnez le composant Session Firebase et ajoutez une action. Choisissez parmi les événements déclencheurs : 

• Utilisateur connecté : la session utilisateur est valide. Ce déclencheur permet par exemple de passer à l'écran suivant si l'utilisateur est connecté. 
• Utilisateur déconnecté : la session utilisateur est expirée. Il vous permet par exemple de rediriger l'utilisateur vers l'écran d'authentification.

Vous pouvez également déconnecter l'utilisateur : Agir sur un composant > Session Firebase > Se déconnecter. 

Gérer vos utilisateurs

Vous pouvez gérer vos utilisateurs directement sur Firebase.

Rendez-vous dans  Authentication et dans l'onglet Utilisateurs pour retrouver votre base d'utilisateurs. Vous avez accès aux données suivantes : l'email, la date de création, la date de dernière connexion et son identifiant unique (ID utilisateur). 

Vous pouvez ajouter manuellement un ou plusieurs utilisateurs. 

Gestion des sessions sans interface utilisateur (utilisation headless)

Si vous souhaitez concevoir une interface entièrement personnalisée, vous pouvez utiliser  Session Firebase sans interface visuelle. Cette utilisation headless vous permet de gérer les sessions en arrière-plan tout en construisant une UI sur mesure.

Fonctionnalités disponibles en utilisation headless :

• Authentification par email et mot de passe : vous pouvez intégrer des champs Saisie de texte pour saisir les identifiants, puis déclenchez l’action d’authentification.

• Connexion avec un jeton personnalisé : idéal pour des systèmes où le backend génère des jetons sécurisés.

• Inscription avec des champs personnalisés : utilisez le champ Traits pour collecter des informations complémentaires pour chaque utilisateur. Cela peut inclure des réponses à des questionnaires ou des données de qualification, qui enrichissent les profils utilisateurs pour offrir une expérience plus personnalisée.

• Gestion des erreurs : lorsqu’une erreur survient, comme un email mal formaté, l’événement Erreur de connexion ou Erreur d'inscription capture le message d’erreur. Vous pouvez stocker ce message dans une variable et l’afficher via un composant Condition ou Texte.