Premiers pas avec Google Analytics pour le Web

Sélectionnez la plate-forme : iOS+ Android Web Flutter Unity C++

Ce guide de démarrage rapide explique comment ajouter Google Analytics à votre application et commencer à enregistrer des événements.

Google Analytics collecte des données d'utilisation et de comportement pour votre application Web. Le SDK enregistre deux principaux types d'informations :

  • Événements : tout ce qui se passe dans votre application, comme les actions de l'utilisateur, les événements système ou les erreurs.

  • Propriétés utilisateur : attributs que vous définissez pour décrire des segments de votre base d'utilisateurs, comme leur préférence linguistique ou leur position géographique.

Analytics enregistre automatiquement certains événements et propriétés utilisateur. Il n'y a donc pas de code à ajouter pour les activer.

Avant de commencer

Si ce n'est pas déjà fait, ajoutez Firebase à votre projet JavaScript et assurez-vous que Google Analytics est activé dans votre projet Firebase :

  • S'il s'agit d'un nouveau projet Firebase, activez Google Analytics pendant que vous le créez.

  • Si vous utilisez un projet Firebase existant où Google Analytics n'est pas activé, activez-le en accédant à l'onglet Intégrations de vos > Paramètres du projet.

Lorsque vous activez Google Analytics dans votre projet, vos applications Web Firebase sont associées à des flux de données Google Analytics liés à une propriété Application + Web.

Ajouter le Analytics SDK à votre application

Selon la façon dont votre application Web est hébergée, votre configuration peut être gérée automatiquement ou vous devrez peut-être mettre à jour votre objet de configuration Firebase. Si votre application Web utilise déjà Google Analytics, vous devrez peut-être effectuer une configuration supplémentaire décrite dans Utiliser Firebase avec le taggage gtag.js existant.

  1. Vérifiez que l'objet de configuration Firebase dans votre code contient measurementId. Cet ID est créé automatiquement lorsque vous activez Analytics dans votre projet Firebase et que vous enregistrez une application Web. Il est obligatoire pour utiliser Analytics.

    • Si votre application utilise Firebase Hosting et utilise des URL réservées pour les SDK Firebase :

      Firebase gère automatiquement la configuration de votre application. Pour terminer la configuration, ajoutez les scripts de la fiche Vos applications dans les paramètres de votre projet à la balise <body> de votre application, si ce n'est pas déjà fait.

    • Si votre application n'utilise pas d'URL réservées : Si vous travaillez avec une application Web existante, mettez à jour l'objet de configuration Firebase dans votre code pour vous assurer que le champ measurementId est présent. L'objet de configuration doit ressembler à l'exemple suivant :

      // For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field
const firebaseConfig = {
  apiKey: "API_KEY",
  authDomain: "PROJECT_ID.firebaseapp.com",
  databaseURL: "https://PROJECT_ID.firebaseio.com",
  projectId: "PROJECT_ID",
  storageBucket: "PROJECT_ID.firebasestorage.app",
  messagingSenderId: "SENDER_ID",
  appId: "APP_ID",
  measurementId: "G-GA_MEASUREMENT_ID"
};
      1. Si ce n'est pas déjà fait, installez le SDK Firebase JS et initialisez Firebase. 2. Ajoutez le Analytics SDK JS et initialisez Analytics : * { Web } 
        import { initializeApp } from "firebase/app";
  import { getAnalytics } from "firebase/analytics";

  // TODO: Replace the following with your app's Firebase project configuration
  // See: https://firebase.google.com/docs/web/learn-more#config-object
  const firebaseConfig = {
      // ...
  };

  // Initialize Firebase
  const app = initializeApp(firebaseConfig);

  
  // Initialize Analytics and get a reference to the service
  const analytics = getAnalytics(app);
      * { Web } 
        import firebase from "firebase/compat/app";
  import "firebase/compat/analytics";

  // TODO: Replace the following with your app's Firebase project configuration
  // See: https://firebase.google.com/docs/web/learn-more#config-object
  const firebaseConfig = {
      // ...
  };

  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);

  
  // Initialize Analytics and get a reference to the service
  const analytics = firebase.analytics();

Utiliser Firebase avec le taggage gtag.js existant

Si vous avez déjà exécuté Google Analytics dans votre application à l'aide de l' extrait gtag.js, vous devrez peut-être effectuer une configuration supplémentaire si vous prévoyez d'effectuer l'une des opérations suivantes :

  • Ajouter des appels Google Analytics de Firebase à la page, mais planifier également de continuer à utiliser des appels gtag() directement sur la même page.
  • Utiliser le même ID de mesure entre les appels gtag() directs et Google Analytics données envoyées à Firebase.

Pour vous assurer que vos événements sont disponibles pour tous les services Firebase, procédez comme suit :

  • Supprimez la ligne gtag('config', 'GA_MEASUREMENT_ID'); où le GA_MEASUREMENT_ID est le measurementId de votre application Web Firebase. Si vous avez d'autres ID pour d'autres propriétés Analytics sur la page, vous n'avez pas besoin de supprimer leur ligne de configuration.
  • Assurez-vous d'appeler firebase.analytics() avant d'envoyer des événements avec gtag().

Sinon, les événements envoyés à cet ID avec des appels gtag() ne seront pas associés à Firebase et ne seront pas disponibles pour le ciblage dans d'autres services Firebase.

Commencer à enregistrer des événements

Une fois que vous avez initialisé le service Analytics, vous pouvez commencer à enregistrer des événements avec la logEvent() méthode.

Certains événements sont recommandés pour toutes les applications ; d'autres le sont pour des types d'entreprises ou des secteurs spécifiques. Vous devez envoyer les événements suggérés avec leurs paramètres prescrits pour disposer de rapports aussi détaillés que possible, et profiter des futures fonctionnalités et intégrations dès qu'elles seront disponibles. Cette section explique comment enregistrer un événement prédéfini. Pour en savoir plus sur l'enregistrement des événements, consultez la page Événements de journaux.

L'exemple suivant montre comment enregistrer un événement recommandé pour indiquer qu'un utilisateur a reçu une notification dans votre application :

Web

import { getAnalytics, logEvent } from "firebase/analytics";

const analytics = getAnalytics();
logEvent(analytics, 'notification_received');
analytics_log_event.js

Web

firebase.analytics().logEvent('notification_received');
index.js

Étapes suivantes