開始使用 Google Analytics


本快速入門導覽課程說明如何在應用程式中新增 Google Analytics，並開始記錄事件。

Google Analytics 會收集您網頁應用程式的使用情況和行為資料。SDK 會記錄兩種主要資訊：

  • 事件：應用程式的動態 (例如使用者動作、系統事件或錯誤)。

  • 使用者屬性：您定義的屬性，用來描述使用者族群區隔，例如語言偏好設定或地理位置。

Analytics 會自動記錄部分事件和使用者屬性，您不必新增任何程式碼即可啟用這些屬性。

事前準備

如果您尚未將 Firebase 新增至 JavaScript 專案，請先新增，並確認已在 Firebase 專案中啟用 Google Analytics：

  • 如果您要建立新的 Firebase 專案，請在專案建立工作流程中啟用 Google Analytics。

  • 如果您使用的現有 Firebase 專案未啟用 Google Analytics，請前往「專案」設定的「整合」分頁標籤 >「專案設定」 啟用。

在專案中啟用 Google Analytics 後，Firebase 網頁應用程式就會連結至與應用程式 + 網站資源相關聯的 Google Analytics 資料串流。

在應用程式中新增「Analytics」SDK

視網頁應用程式的託管方式而定，系統可能會自動處理設定，也可能需要您更新 Firebase 設定物件。如果您的網路應用程式已使用 Google Analytics，可能需要進行使用現有 gtag.js 代碼搭配 Firebase 一文所述的額外設定。

  1. 檢查程式碼中的 Firebase 設定物件是否包含 measurementId。啟用 Firebase 專案中的 Analytics 並註冊網頁應用程式時，系統會自動建立這個 ID，且使用 Analytics 時必須提供這個 ID。

    • 如果您的應用程式使用 Firebase Hosting 並使用 Firebase SDK 的保留網址：

      Firebase 會自動處理應用程式設定。如要完成設定，請將「專案設定」中「您的應用程式」資訊卡的指令碼新增至應用程式的 <body> 標記 (如果尚未新增)。

    • 如果您的應用程式未使用保留網址：如果您使用現有的網頁應用程式，請更新程式碼中的 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. 新增 Analytics JavaScript SDK 並初始化 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();

搭配現有的 gtag.js 代碼使用 Firebase

如果您先前在應用程式中執行 Google Analytics 時使用 gtag.js 程式碼片段，且打算執行下列任一操作，應用程式可能需要額外設定：

  • 在網頁中新增來自 Firebase 的 Google Analytics 呼叫，但打算繼續在同一網頁中直接使用 gtag() 呼叫。
  • 想在直接 gtag() 呼叫和傳送至 Firebase 的 Google Analytics 資料之間使用相同的評估 ID。

如要確保所有 Firebase 服務都能使用事件，請完成下列額外設定步驟：

  • 移除 gtag('config', 'GA_MEASUREMENT_ID'); 行，其中 GA_MEASUREMENT_ID 是 Firebase 網頁應用程式的 measurementId。如果網頁上有其他 Analytics 資源的 ID，則不需要移除其設定行。
  • 請務必先呼叫 firebase.analytics()，再透過 gtag() 傳送任何事件。

否則，透過 gtag() 呼叫傳送至該 ID 的事件不會與 Firebase 建立關聯，也無法在其他 Firebase 服務中用於指定目標。

開始記錄事件

初始化 Analytics 服務後，即可使用 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

後續步驟