Intégrer Firebase Analytics dans une application Flutter

Comment intégrer Firebase Analytics dans Flutter

Voici les étapes à suivre pour intégrer le service Firebase Analytics dans votre projet Flutter.

Étape 1 : Installation du package Firebase Analytics

La première étape pour mettre en place Firebase Analytics va consister à ajouter les packages nécessaires dans votre application. Pour cela :

1. Ouvrez le fichier pubspec.yaml de votre projet.
2. Ajoutez les dépendances suivantes (vérifiez les dernières versions sur pub.dev) :

dependencies:
  firebase_analytics: latest_version
  firebase_core: latest_version

3. Exécutez la commande suivante pour installer les dépendances :

flutter pub get

4. Importez les packages dans votre fichier Dart principal (généralement main.dart) :

import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_analytics/firebase_analytics.dart';
import 'package:firebase_analytics/observer.dart';

Firebase Analytics est maintenant installé sur votre application, mais il nous reste encore quelques étapes avant de pouvoir l’utiliser.

Étape 2 : Configuration pour Android et iOS

Firebase Analytics va nécessiter des ajustements dans les fichiers de configuration pour fonctionner sur Android et iOS. Voici comment faire pour les deux versions.

Configuration pour Android

Dans le fichier android/build.gradle ajoutez les plugins Google Services et Crashlytics dans la section dependencies :

buildscript {
    dependencies {
        classpath 'com.google.gms:google-services:4.4.2'  # Vérifiez la dernière version
        classpath 'com.google.firebase:firebase-crashlytics-gradle:3.0.2'  # Vérifiez la dernière version
    }
}

Dans android/settings.gradle incluez les plugins dans la section plugins :

plugins {
    id 'com.google.gms.google-services' version '4.3.15' apply false // Assurez-vous d'avoir la dernière version
    id "com.google.firebase.crashlytics" version "2.8.1" apply false // Assurez-vous d'avoir la dernière version
}

Cela garantit que les plugins nécessaires sont disponibles dans votre projet pour être utilisés dans l’application.

Dans le fichier android/app/build.gradle appliquez ces plugins à la fin du fichier :

apply plugin: 'com.google.gms.google-services'
apply plugin: 'com.google.firebase.crashlytics'

Ces lignes doivent être ajoutées à la fin du fichier

Enfin, mettez à jour de votre fichier android/app/src/main/AndroidManifest.xml en y ajoutant la ligne suivante dans la section <application> :

<meta-data android:name="firebase_analytics_collection_enabled" android:value="true" />

Ceci garantit que la collecte des données analytiques est activée.

Configuration pour iOS

Pour IOS, commencez par ajouter votre fichier GoogleService-Info.plist si ce n’est pas déjà fait. pour cela, téléchargez le depuis la console Firebase (section « Paramètres du projet ») et placez-le dans le dossier ios/Runner. Vérifiez ensuite dans Xcode, qu’il a bien été ajouté.

Ensuite mettez à jour votre fichier ios/Podfile en y ajoutant cette ligne :

pod 'Firebase/Analytics'

Exécutez ensuite la commande pod install depuis le dossier ios de votre projet Flutter.

Étape 3 : Initialisation de Firebase Analytics

Avant de pouvoir utiliser Firebase Analytics, vous devez initialiser Firebase dans votre projet Flutter. Pour cela, modifiez votre fonction main() de la manière suivante :

import 'package:firebase_core/firebase_core.dart'; 
import 'package:firebase_analytics/firebase_analytics.dart';
//Pensez bien à importer les packages firebase core et firebase analytics
import 'package:flutter/material.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MyApp());
}

Ensuite, créez une instance réutilisable de Firebase Analytics avec un observateur pour le suivi de navigation et placez le dans votre MaterialApp() :

class MyApp extends StatelessWidget {
  static FirebaseAnalytics analytics = FirebaseAnalytics.instance;
  static FirebaseAnalyticsObserver observer = FirebaseAnalyticsObserver(analytics: analytics);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorObservers: <NavigatorObserver>[observer], // Ajoutez l'observer ici
      home: HomeScreen(),
    );
  }
}

Dès à présent cet observervous permet de suivre le parcours des utilisateurs à travers vos pages. Nous allons ensuite voir, comment créer des évènements personnalisé, comme un clic sur un bouton, ou la complétion d’une commande.

Enregistrer des événements analytiques personnalisés

Maintenant que Firebase Analytics est configuré sur votre projet Flutter, il est temps de commencer à enregistrer des évènements. Pour cela, créez une classe dédiée qui va gérer ces dits événements :

class AnalyticsService {
  final FirebaseAnalytics _analytics = FirebaseAnalytics.instance;

  Future<void> sendAnalyticsEvent({
    required String name,
    required String category,
    required String value,
  }) async {
    await _analytics.logEvent(
      name: name,
      parameters: {
        'category': category,
        'value': value,
      },
    );
  }
}

Cette classe va vous permettre d’enregistrer des événements en appelant la méthode logEvent, qui accepte trois paramètres :

• nameValue : Le nom générique de l’événement (par exemple button_click).
• kindOfEvent : La catégorie ou le type de l’événement (par exemple action).
• eventValue : La valeur associée à l’événement (par exemple button_back).

Si on prend l’exemple d’une application de e-commerce, voilà ensuite à quoi pourrait ressembler un évènement :

AnalyticsService().sendAnalyticsEvent(
  name: 'purchase',
  category: 'transaction',
  value: 'product_id_123',
);

Vérifier que les événements sont bien enregistrés dans Analytics

Une fois vos événements configurés, vous devez vérifier qu’ils sont correctement envoyés à Firebase Analytics. Voici trois méthodes pour le faire.

Méthode 1 : Utiliser ADB Logcat

ADB Logcat est un outil puissant vous permettant d’inspecter les logs de votre application Android en temps réel. Pour cela, connectez votre appareil ou émulateur, puis exécutez la commande suivante dans un terminal :

adb logcat -v time -s FA FA-SVC

Cette commande va filtrer les logs pour afficher uniquement ceux liés à Firebase Analytics (FA pour Firebase Analytics, FA-SVC pour le service). Si tout fonctionne correctement, vous devriez voir des messages confirmant l’envoi des événements. Dans le cas contraire, il y a peut être quelque qui cloche avec ceux-ci.

Méthode 2 : Utiliser Firebase DebugView

Firebase DebugView est un dashboard disponible dans la console Firebase, qui affiche les événements en temps réel. Pour l’utiliser, commencez par activer le mode débogage en executant cette commande avec l’application lancée sur votre émulateur ou votre téléphone :

adb shell setprop debug.firebase.analytics.app <package_name>

//Remplacez <package_name> par le nom de package de votre application (par exemple, com.example.myapp), que vous trouverez dans AndroidManifest.xml.

Ensuite, accédez à DebugView en vous connectant à la console Firebase, en sélectionnant votre projet, et allant dans Analytics > DebugView. Interagissez avec votre application, et les événements devraient normalement apparaître sous forme de points sur une chronologie. Cliquez sur un point pour voir les détails (nom, paramètres).

Une fois que vous avez terminé vos test, pensez à désactiver le mode débogage avec cette commande :

adb shell setprop debug.firebase.analytics.app .none.

Méthode 3 : Consulter les rapports dans la Console Analytics

Enfin, la dernière solution est simplement de consulter les rapports dans la console Firebase. Pour cela, allez dans Firebase Console > Analytics > Events et cliquez sur un événement pour voir ses détails, comme le nombre d’occurrences, les paramètres associés, et les tendances.

Problèmes fréquents et solutions

Comme souvent quand on fait quelque chose pour la première fois, l’intégration de Firebase Analytics peut ne pas se dérouler parfaitement. Voici les erreurs les plus courantes, leurs causes, et comment les résoudre, en s’appuyant sur les codes d’erreur officiels de Firebase.

1. Erreur « Firebase not initialized » :
   • Cause : L’appel à Firebase.initializeApp() est absent ou mal placé.
   • Solution : Vérifiez que await Firebase.initializeApp() est appelé dans main.dart avant runApp. Assurez-vous aussi que les fichiers google-services.json (Android) ou GoogleService-Info.plist (iOS) sont correctement configurés.
     
2. Événements non visibles dans DebugView :
   • Cause : Le mode débogage n’est pas activé ou le nom du package est incorrect.
   • Solution : Exécutez adb shell setprop debug.firebase.analytics.app <package_name> et vérifiez le nom du package dans AndroidManifest.xml. Testez avec Logcat pour confirmer l’envoi des événements.
     
3. Nom d’événement ou paramètre invalide (Codes 2, 3, 13, 14) :
   • Cause : Le nom de l’événement ou du paramètre est vide, trop long, ou contient des caractères interdits (comme -). Par exemple, button-click est invalide.
   • Solution : Utilisez uniquement des lettres, chiffres, et underscores (ex. button_click). Un événement invalide est ignoré, et un événement firebase_error est enregistré avec un paramètre firebase_error_value indiquant le nom problématique.
     
4. Valeur de paramètre trop longue (Code 4) :
   • Cause : La valeur d’un paramètre dépasse la limite de caractères autorisée.
   • Solution : Raccourcissez la valeur ou divisez les données en plusieurs paramètres. Le paramètre non valide est supprimé, et un firebase_error est ajouté.
     
5. Trop de paramètres dans un événement (Code 5) :
   • Cause : Un événement contient plus de 25 paramètres.
   • Solution : Limitez-vous à 25 paramètres essentiels. Les paramètres excédentaires sont ignorés, et un firebase_error est enregistré.
     
6. Problèmes Gradle ou Podfile :
   • Cause : Versions incompatibles des plugins ou erreurs de configuration.
   • Solution : Vérifiez les versions recommandées dans la documentation Firebase. Pour Gradle, assurez-vous que les plugins sont appliqués dans le bon ordre.

Conclusion

En suivant ces étapes, vous avez maintenant intégré Google Analytics dans votre application Flutter et vous êtes capable de suivre les interactions des utilisateurs à travers des événements personnalisés. N’oubliez pas de tester vos événements et de vérifier les logs pour vous assurer que toutes les données sont correctement envoyées à Firebase. Google Analytics vous fournira une vue d’ensemble puissante sur l’utilisation de votre application et vous aidera à prendre des décisions basées sur des données.