Google Analytics for Firebase の設定方法(Web)

Google Analytics for Firebase の設定方法(Web)

(正直、公式ドキュメント見れば済む話です。)

https://firebase.google.com/docs/analytics/get-started

有効化する #

以下の手順で有効化します。

Firebase コンソール
  > プロジェクト設定
    > 統合
      > Google Analytics
        > 有効にする
  • 紐づける Google Analytics アカウントを選択するか新規作成します。
  • 紐づけるプロパティを選択するか新規作成します。
  • 「有効化する」ボタンを押下します。

初期化方法を更新する #

先の有効化ボタンを押下すると次の案内が表示されるはずです。

次に Firebase を初期化し、使用するプロダクトの SDK の利用を開始します。

// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: "***************************************",
  authDomain: "example-project.firebaseapp.com",
  projectId: "example-project",
  storageBucket: "example-project.appspot.com",
  messagingSenderId: "1234567890123",
  appId: "1:1234567890123:web:**********************",
  measurementId: "G-**********",
};

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

measurementId のプロパティ(G-**********)が追加されています。

上記に従って初期化する際のコードを変更しましょう。

なおこのページを閉じた後でも Google Analytics のプロパティ設定のページから measurementId が確認できます。(測定 ID という名称で表示されているはず)

ロギングする #

あとは 作成された analytics インスタンスに対して処理を呼び出せばロギングされます。

import { logEvent } from "firebase/analytics";

logEvent(analytics, "notification_received");