Guide pour mettre en place cloud functions avec Flutter

À quoi sert Firebase Cloud Functions ?

Firebase Cloud Functions est un service backend sans serveur (serverless) qui vous permet de déployer des fonctions backend. Celle-cis pourront s’exécuter automatiquement en réponse à des événements provenant de Firebase ou de services externes. Par exemple, il sera possible de les déclencher lors, de modifications dans votre base de données, l’authentification de l’utilisateur, ou lors d’une requête HTTP.

Voici quelques exemples concrets, de comment Cloud Functions peut être utilisé :

1. Envoi de Notifications Push Automatiques : Vous pouvez envoyer automatiquement une notification à un utilisateur lorsqu’il reçoit un nouveau message.
2. Traitement des Paiements : Si votre application Flutter intègre un système de paiement, vous pouvez utiliser Cloud Functions pour vérifier les informations avant de les intégrer à votre base de données.
3. Gestion des Permissions et de la Sécurité : Si un utilisateur tente de modifier un champ particulier dans Firestore, une Cloud Function peut intervenir pour vérifier les permissions de l’utilisateur avant d’autoriser ou non cette modification.
4. Nettoyage Automatique de Données : Lorsqu’un utilisateur supprime son compte, une fonction peut se déclencher pour automatiquement effacer toutes ses données.

Comment Mettre en Place des Cloud Functions avec Flutter sur Visual Studio

Voici la liste des étapes à suivre, pour mettre en place des fonctions en back-end avec Firebase Cloud Functions et Flutter, dans Visual Studio.

Préparation du projet dans Firebase

Avant de pouvoir configurer vos Cloud Functions, il est important de s’assurer que votre projet Firebase est correctement configuré. Pour cela, accédez à votre console Firebase et rendez-vous dans la section Cloud Functions.

Si ce n’est pas déjà fait, assurez-vous d’avoir activé le plan Blaze (facturation à l’usage), nécessaire pour utiliser les Cloud Functions. Commencez par créer un compte de facturation Google Cloud si vous n’en avez pas un. Puis, ajoutez vos informations de facturation ainsi qu’une carte bancaire valide, pour pouvoir payer à l’usage.

Configuration des Cloud Functions dans Visual Studio

Une fois votre projet Firebase configuré, vous devrez ajouter un dossier functions dans votre dossier Flutte. Comme son nom l’indique, celui-ci va vous permettre de stocker vos fonctions et vous permettre de les déployer dans Firebase. Voici comment procéder :

1. Installer les outils Firebase CLI : Ouvrez un terminal et entrez la commande suivante pour installer Firebase CLI globalement, si vous ne l’avez pas déjà fait.

npm install -g firebase-tools

2. Connectez votre projet à Firebase : À partir de la racine de votre projet, connectez-vous à votre compte Firebase en utilisant la commande qui suit.

firebase login

Si vous êtes déjà connecté, vérifiez que vous avez accès à vos projets Firebase avec cette commande :

firebase projects:list

Si vous rencontrez l’erreur Failed to list Firebase projects. See firebase-debug.log for more info., réauthentifiez-vous en utilisant :

firebase login --reauth

Suivez les instructions pour finaliser la connexion.

Initialisation des Cloud Functions

Maintenant que vous êtes connecté à Firebase, vous pouvez initialiser les Cloud Functions dans votre projet. Voici les étapes à suivre :

1. Toujours à la racine de votre projet, exécutez la commande :

firebase init

2. Dans le menu qui s’affiche, sélectionnez l’option Functions: Configure a Cloud Functions directory and its files. Utilisez la barre d’espace pour sélectionner cette option, puis appuyez sur Entrée.

3. Lorsqu’il vous est demandé de choisir un projet, sélectionnez Use an existing project et choisissez votre projet Firebase.

4. Vous aurez ensuite à choisir un langage pour écrire vos fonctions. Les options disponibles sont JavaScript, TypeScript, et Python. Je vous recommande d’utiliser TypeScript, comme conseillé dans la documentation officielle de Firebase.

5. À la question « Do you want to use ESLint to catch probable bugs and enforce style? », choisissez Yes (Y). ESLint vous aidera à détecter rapidement les erreurs potentielles dans vos fonctions, en vous prévenant des erreurs de syntaxe au moment du déploiement. Toutefois, attention, sélectionner cette option rend impossible le déploiement tant que toutes les erreurs n’ont pas été corrigées.

6. Enfin, pour installer automatiquement les dépendances nécessaires à vos fonctions, répondez Yes à la question « Do you want to install dependencies with npm now? ».

Préparation du dossier functions

Une fois l’initialisation terminée, vous pouvez rapidement vérifier que tout est correctement configuré dans le dossier functions. Suivez ces étapes :

1. Accédez au dossier functions en utilisant la commande :

cd functions

2. Assurez-vous que toutes les dépendances sont bien installées et à jour en exécutant :

npm install

La mise en place de Cloud Functions pour votre projet Flutter est désormais terminée, il ne vous reste plus qu’à écrire vos fonctions et les déployer dans Firebase.

Installer le package Cloud Firestore

Enfin, la dernière étape va être d’installer le package Cloud Firestore dans sa dernière version (5.6.2) dans votre projet Flutter. Pour cela vous pouvez soit : 

• Lancer la commander $ flutter pub add cloud_firestore dans votre terminal de commandes ; 
• Copier et coller cloud_firestore: ^5.6.2 dans vos dépendances, dans votre fichier pubspec.yaml. 

Enfin, ajoutez la ligne d’importation suivante dans les fichiers où vous souhaitez utiliser les fonctions clouds que vous aurez codées :

import 'package:firebase_auth/firebase_auth.dart';

Écrire vos fonctions dans Visual Studio

Avant de déployer vos fonctions, la première étape est de les écrire dans le langage que vous avez choisi. Bien que je pourrais rédiger des guides sur l’utilisation de TypeScript, mon conseil est de faire appel à ChatGPT pour vous aider à coder. Cette approche fonctionne très bien, à condition d’être clair et précis dans la description des actions que vous souhaitez réaliser et des moments où elles doivent s’exécuter.

Où écrire vos fonctions ?

Une fois Firebase initialisé dans votre projet avec la commande firebase init, un dossier functions est créé à la racine. C’est dans ce dossier que vous écrivez vos Cloud Functions, dans le fichier index.js ou index.ts selon le langage choisi.

Erreurs Typescript Courantes et Solutions

1. Erreur : Indentation incorrecte
   • Message d’erreur : Expected indentation of X spaces but found Y indent
   • Solution : Vérifiez l’indentation de vos lignes. TypeScript, lorsqu’il est configuré avec ESLint, attend un certain nombre d’espaces ou de tabulations pour chaque niveau d’imbrication dans le code. Par exemple, si vous voyez « Expected indentation of 12 spaces but found 10 », vous devez ajouter deux espaces ou ajuster les tabulations pour correspondre à la convention d’indentation.
2. Erreur : Espaces en fin de ligne interdits
   • Message d’erreur : Trailing spaces not allowed
   • Solution : Supprimez les espaces inutiles à la fin de la ligne de code. Cela peut être fait manuellement ou en utilisant des outils d’auto-formatage comme Prettier.
3. Erreur : Ligne trop longue
   • Message d’erreur : This line has a length of X. Maximum allowed is Y
   • Solution : Réduisez la longueur de la ligne à la limite spécifiée (généralement 80 ou 100 caractères). Pour cela, vous pouvez découper la ligne en plusieurs lignes ou utiliser des variables intermédiaires pour rendre le code plus lisible.
4. Erreur : Variable non utilisée
   • Message d’erreur : Variable 'X' is declared but its value is never read
   • Solution : Supprimez les variables déclarées qui ne sont jamais utilisées, ou utilisez-les correctement dans le code. Cette erreur aide à éviter le code inutile ou obsolète.
5. Erreur : Import non utilisé
   • Message d’erreur : 'X' is defined but never used
   • Solution : Retirez les imports de modules ou de fonctions que vous n’utilisez pas. Les imports inutilisés peuvent alourdir le code sans raison.
6. Erreur : Typage incorrect
   • Message d’erreur : Type 'X' is not assignable to type 'Y'
   • Solution : Vérifiez que les types des variables, paramètres et retours de fonctions sont corrects. Si vous essayez d’assigner une valeur d’un type non compatible, ajustez le type ou convertissez la valeur pour correspondre au type attendu.
7. Erreur : Fonction async manquante
   • Message d’erreur : Expected 'await' to be called inside an async function
   • Solution : Si vous utilisez await dans une fonction, assurez-vous que la fonction est définie comme async. Ajoutez le mot-clé async avant la déclaration de la fonction.
8. Erreur : Valeur null ou undefined non gérée
   • Message d’erreur : Object is possibly 'null' or 'undefined'
   • Solution : Utilisez des vérifications de nullité avant d’accéder à des objets ou valeurs. Vous pouvez également utiliser des opérateurs comme ?. ou ?? pour gérer ces cas sans provoquer d’erreur.

Comment déployer vos fonctions ?

Une fois vos fonctions écrites, vous pouvez les déployer sur Firebase en exécutant la commande suivante à la racine de votre projet :

firebase deploy --only functions

Une fois vos fonctions déployées dans le cloud, celles-ci seront exécutées selon les événements que vous avez définis.

Vérifier si votre fonction fonctionne

Une fois vos fonctions déployées, il vous reste encore à les tester. Pour cela, je vous conseille d’utiliser ces trois outils :

Un émulateur : Vous pouvez utiliser l’outil Firebase Emulator pour tester vos fonctions localement avant de les déployer, avec la commande firebase emulators:start. Cela vous permet de simuler des événements et de vérifier si tout fonctionne comme prévu.

Journaux Firebase : Après déploiement, vous pouvez surveiller les exécutions en consultant les journaux en temps réel, soit depuis Firebase (dans Cloud functions, menu avec trois petits points à droite), soit dans Visual Studio avec la commande :

firebase functions:log

Cloud Scheduler : Si vous avez des fonctions qui doivent s’exécuter à des intervalles réguliers mais ne voulez pas attendre, vous pouvez utiliser Cloud Scheduler pour forcer le déclenchement de celles-ci.

Prix du service Cloud Functions

Le prix est un élément important lorsqu’il faut faire le choix des technologies à utiliser pour son application. Firebase propose un plan gratuit avec des quotas limité et une facturation à l’usage pour les volumes plus importants, via le plan Blaze.

Explications :

1. Invocations : Nombre de fois où une fonction est appelée.
2. Temps de CPU : Temps pendant lequel la fonction utilise les ressources de calcul.
3. Mémoire : Quantité de mémoire consommée par vos fonctions pendant leur exécution.
4. Sortie réseau : Quantité de données envoyées par les fonctions Cloud (ex. : vers l’extérieur, comme un autre serveur ou API).

Conclusion

Vous êtes désormais en mesure de mettre en place des évènements en back-end de votre application. Alors pourquoi ne pas mettre en place un système de push notifications pour intérargir avec vos utilisateurs ?

Mettre en place des Push Notifications dans Flutter →