Rozpoczęcie korzystania z Google Analytics


Z tego samouczka dowiesz się, jak dodać do aplikacji Google Analytics i rozpocząć rejestrowanie zdarzeń.

Google Analytics zbiera dane o użytkowaniu i zachowaniu Twojej aplikacji internetowej. Pakiet SDK rejestruje 2 główne typy informacji:

  • Zdarzenia: to, co dzieje się w aplikacji, np. działania użytkowników, zdarzenia systemowe lub błędy.

  • Właściwości użytkownika: atrybuty zdefiniowane przez Ciebie, aby opisać segmenty użytkowników, np. ustawienia języka lub lokalizacja geograficzna.

Analytics automatycznie rejestruje niektóre zdarzenia i właściwości użytkownika. Nie musisz dodawać żadnego kodu, aby je włączyć.

Zanim zaczniesz

Jeśli nie masz jeszcze Firebase w projekcie JavaScript, dodaj Firebase do tego projektu i upewnij się, że w projekcie Firebase jest włączona opcja Google Analytics:

  • Jeśli tworzysz nowy projekt Firebase, włącz Google Analytics w trakcie procesu tworzenia projektu.

  • Jeśli używasz dotychczasowego projektu Firebase, w którym nie włączono funkcji Google Analytics, przejdź do karty Integracje > Ustawienia projektu, aby ją włączyć.

Gdy włączysz Google Analytics w projekcie, Twoje aplikacje internetowe Firebase zostaną połączone ze strumieniami danych Google Analytics powiązanymi z usługą Aplikacje + internet.

Dodaj do aplikacji pakiet SDK Analytics

W zależności od tego, jak hostowana jest aplikacja internetowa, konfiguracja może zostać potraktowana automatycznie lub konieczne może być zaktualizowanie obiektu konfiguracji Firebase. Jeśli Twoja aplikacja internetowa korzysta już z Google Analytics, może być konieczne przeprowadzenie dodatkowej konfiguracji opisanej w artykule Używanie Firebase z tagowaniem gtag.js.

  1. Sprawdź, czy obiekt konfiguracji Firebase w kodzie zawiera measurementId. Ten identyfikator jest tworzony automatycznie, gdy włączysz Analytics w projekcie Firebase i zarejestrujesz aplikację internetową. Jest on wymagany do korzystania z funkcji Analytics.

    • Jeśli Twoja aplikacja używa Firebase Hosting oraz zarezerwowanych adresów URL dla pakietów SDK Firebase:

      Firebase automatycznie skonfiguruje Twoją aplikację. Aby dokończyć konfigurację, dodaj skrypty z karty Twoje aplikacje w ustawieniach projektu do tagu <body> w aplikacji.

    • Jeśli Twoja aplikacja nie używa zarezerwowanych adresów URL: jeśli pracujesz z dotychczasową aplikacją internetową, zaktualizuj obiekt konfiguracji Firebase w kodze, aby mieć pewność, że pole measurementId jest obecne. Obiekt config powinien wyglądać podobnie do tego:

      // For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field
const firebaseConfig = {
  apiKey: "AIzaSyCGQ0tYppWFJkuSxBhOpkH0xVDmX245Vdc",
  authDomain: "project-id.firebaseapp.com",
  databaseURL: "https://project-id.firebaseio.com",
  projectId: "project-id",
  storageBucket: "project-id.appspot.com",
  messagingSenderId: "637908496727",
  appId: "2:637908496727:web:a4284b4c99e329d5",
  measurementId: "G-9VP01NDSXJ"
};

  2. Jeśli jeszcze tego nie zrobiono, zainstaluj pakiet SDK Firebase JS i zainicjuj Firebase.

  3. Dodaj pakiet JS SDK Analytics i zainicjuj 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();

Korzystanie z Firebase z dotychczasowym tagowaniem za pomocą gtag.js

Jeśli w Twojej aplikacji działało wcześniej Google Analytics przy użyciu fragmentu kodu gtag.js, może być konieczna dodatkowa konfiguracja aplikacji, jeśli planujesz wykonać jedną z tych czynności:

  • Dodaj do strony wywołania Google Analytics z Firebase, ale nadal używaj wywołań gtag() bezpośrednio na tej samej stronie.
  • Chcesz używać tego samego identyfikatora pomiaru w przypadku bezpośrednich wywołań gtag() i danych Google Analytics wysyłanych do Firebase.

Aby mieć pewność, że zdarzenia są dostępne do użycia przez wszystkie usługi Firebase, wykonaj te dodatkowe czynności konfiguracyjne:

  • Usuń wiersz gtag('config', 'GA_MEASUREMENT_ID');, w którym GA_MEASUREMENT_ID to measurementId Twojej aplikacji internetowej Firebase. Jeśli masz na stronie inne identyfikatory innych usług Analytics, nie musisz usuwać ich wiersza konfiguracji.
  • Przed wysłaniem zdarzeń za pomocą funkcji gtag() wywołaj funkcję firebase.analytics().

W przeciwnym razie zdarzenia wysyłane do tego identyfikatora za pomocą wywołań gtag() nie będą powiązane z Firebase i nie będą dostępne do kierowania w innych usługach Firebase.

Rozpocznij rejestrowanie zdarzeń

Po zainicjowaniu usługi Analytics możesz zacząć rejestrować zdarzenia za pomocą metody logEvent().

Niektóre zdarzenia są zalecane we wszystkich aplikacjach, a inne w przypadku określonych typów działalności lub branż. Sugerowane zdarzenia i ich parametry należy przesyłać razem z zalecanymi parametrami, aby zapewnić maksymalną ilość szczegółów dostępnych w raportach oraz korzystać z przyszłych funkcji i integracji, gdy tylko będą dostępne. W tej sekcji pokazano rejestrowanie zdefiniowanego wstępnie zdarzenia. Więcej informacji o rejestrowaniu zdarzeń znajdziesz w sekcji Zdarzenia z dziennika.

Ten przykład pokazuje, jak zarejestrować zalecane zdarzenie, aby wskazać, że użytkownik otrzymał powiadomienie w aplikacji:

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

Dalsze kroki