Начало работы с Google Аналитикой


В этом кратком руководстве показано, как добавить Google Analytics в ваше приложение и начать регистрировать события.

Google Analytics собирает данные об использовании и поведении пользователей вашего веб-приложения. SDK регистрирует два основных типа информации:

  • События : Что происходит в вашем приложении, например, действия пользователя, системные события или ошибки.

  • Свойства пользователя : Атрибуты, которые вы определяете для описания сегментов вашей пользовательской базы, такие как языковые предпочтения или географическое местоположение.

Аналитика автоматически регистрирует некоторые события и свойства пользователей ; для их включения не требуется добавлять какой-либо код.

Прежде чем начать

Если вы еще этого не сделали, добавьте Firebase в свой проект JavaScript и убедитесь, что Google Analytics включен в вашем проекте Firebase:

  • При создании нового проекта Firebase включите Google Analytics в процессе создания проекта.

  • Если вы используете существующий проект Firebase, в котором не включена Google Analytics , перейдите на вкладку «Интеграции» в вашем проекте. Чтобы включить эту функцию, перейдите в > «Настройки проекта» .

При включении Google Analytics в вашем проекте ваши веб-приложения Firebase связываются с потоками данных Google Analytics , относящимися к свойству App + Web .

Добавьте SDK Analytics в свое приложение.

В зависимости от способа размещения вашего веб-приложения, конфигурация может обрабатываться автоматически, или вам может потребоваться обновить объект конфигурации Firebase . Если ваше веб-приложение уже использует Google Analytics, вам может потребоваться дополнительная настройка, описанная в разделе «Использование Firebase с существующей системой тегирования gtag.js» .

  1. Убедитесь, что ваш объект конфигурации Firebase в коде содержит measurementId . Этот идентификатор создается автоматически при включении Analytics в вашем проекте Firebase и регистрации веб-приложения, и он необходим для использования Analytics .

    • Если ваше приложение использует Firebase Hosting и зарезервированные URL-адреса для SDK Firebase :

      Firebase автоматически настраивает ваше приложение. Для завершения настройки добавьте скрипты из карточки «Ваши приложения» в настройках проекта в тег <body> вашего приложения, если вы еще этого не сделали.

    • Если ваше приложение не использует зарезервированные URL-адреса : Если вы работаете с существующим веб-приложением , обновите объект конфигурации Firebase в вашем коде, чтобы убедиться в наличии поля measurementId . Объект конфигурации должен выглядеть примерно так, как в следующем примере: 

      // 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"
};

  2. Если вы еще этого не сделали, установите Firebase JS SDK и инициализируйте Firebase .

  3. Добавьте JS SDK Analytics и инициализируйте 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();

Используйте Firebase с существующей системой тегирования gtag.js.

Если ранее в вашем приложении использовалась Google Analytics с помощью фрагмента кода gtag.js , то для выполнения одного из следующих действий может потребоваться дополнительная настройка:

  • Добавьте на страницу вызовы Google Analytics из Firebase, но также планируйте продолжить использовать вызовы gtag() непосредственно на той же странице.
  • Хочу использовать один и тот же идентификатор измерения как для прямых вызовов gtag() , так и для данных Google Analytics , отправляемых в Firebase.

Чтобы ваши события были доступны для использования всеми сервисами Firebase, выполните следующие дополнительные шаги настройки:

  • Удалите строку gtag('config', ' GA_MEASUREMENT_ID '); где GA_MEASUREMENT_ID — это measurementId вашего веб-приложения Firebase. Если на странице есть другие ID для других свойств Analytics, удалять строку конфигурации для них не нужно.
  • Перед отправкой событий с помощью gtag() обязательно вызовите firebase.analytics() .

В противном случае события, отправленные на этот идентификатор с помощью вызовов gtag() , не будут связаны с Firebase и не будут доступны для таргетирования в других сервисах Firebase.

Начать регистрацию событий

После инициализации службы аналитики вы можете начать регистрировать события с помощью метода logEvent() .

Некоторые события рекомендуются для всех приложений ; другие — для конкретных типов бизнеса или отраслей. Рекомендуемые события следует отправлять вместе с заданными параметрами, чтобы обеспечить максимальную детализацию отчетов и воспользоваться будущими функциями и интеграциями по мере их появления. В этом разделе показана регистрация предопределенного события; дополнительную информацию о регистрации событий см. в разделе «Регистрация событий» .

Следующий пример демонстрирует, как зарегистрировать рекомендуемое событие, указывающее на то, что пользователь получил уведомление в вашем приложении:

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

Следующие шаги