開始使用 Google Analytics (分析)

本快速入門導覽課程說明如何將 Google Analytics (分析) 新增至您的應用程式，並開始記錄事件。

Google Analytics (分析) 會收集網頁應用程式的使用情形和行為資料。SDK 會記錄兩種主要類型的資訊：

  • 事件：應用程式的運作情況，例如使用者動作、系統事件或錯誤。

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

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

事前準備

如果您尚未將 Firebase 新增至 JavaScript 專案，並確認已在 Firebase 專案啟用 Google Analytics (分析)，請按照下列步驟操作：

  • 如要建立新的 Firebase 專案，請在專案建立工作流程中啟用 Google Analytics (分析)。

  • 如果您使用的是現有的 Firebase 專案，但尚未啟用 Google Analytics (分析)，請依序前往 >「Project settings」(專案設定) 的「Integrations」(整合) 分頁來啟用專案。

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

在應用程式中加入 Analytics (分析) SDK

視網頁應用程式的託管方式而定，系統可能會自動處理設定，或者您可能需要更新 Firebase 設定物件。如果您的網頁應用程式已使用 Google Analytics (分析)，可能需要採取額外設定，如「將 Firebase 與現有的 gtag.js 標記搭配使用」一文所述。

  1. 確認程式碼中的 Firebase 設定物件包含 measurementId。當您在 Firebase 專案中啟用 Analytics (分析) 並註冊網頁應用程式時，系統會自動建立這個 ID。您必須用這個 ID 才能使用 Analytics (分析)。

    • 如果您的應用程式使用 Firebase 託管，「而且」使用 Firebase SDK 的保留網址：

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

    • 如果您的應用程式並未使用保留網址：如果您使用現有的網頁應用程式，請更新程式碼中的 Firebase 設定物件，確保 measurementId 欄位存在。Config 物件應如以下範例所示：

      // 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. 如果您尚未 安裝 Firebase JS SDK 並初始化 Firebase，請先完成這項操作。

  3. 加入 Analytics (分析) JS 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();

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

如果您之前曾使用 gtag.js 程式碼片段在應用程式中執行 Google Analytics (分析)，且打算進行下列其中一項操作，則可能需要額外設定應用程式：

  • 將 Firebase 的 Google Analytics (分析) 呼叫加入頁面，但也打算繼續直接在相同頁面上使用 gtag() 呼叫。
  • 希望在直接 gtag() 呼叫和傳送至 Firebase 的 Google Analytics (分析) 資料之間，使用相同的評估 ID。

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

  • 移除 GA_MEASUREMENT_ID 是 Firebase 網頁應用程式的 measurementId 這一行 gtag('config', 'GA_MEASUREMENT_ID');。如果網頁上有其他 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

後續步驟