Firebase Summit で発表されたすべての情報をご覧ください。Firebase を使用してアプリ開発を加速し、自信を持ってアプリを実行する方法を紹介しています。詳細

GoogleAnalyticsを始めましょう

このクイックスタートでは、Google アナリティクスをアプリに追加し、イベントのログ記録を開始する方法を示します。

Google アナリティクスは、ウェブ アプリの使用状況と行動に関するデータを収集します。 SDK は、主に次の 2 種類の情報をログに記録します。

  • イベント: ユーザー アクション、システム イベント、エラーなど、アプリで何が起こっているか。

  • ユーザー プロパティ: 言語設定や地理的位置など、ユーザー ベースのセグメントを説明するために定義する属性。

Analytics は一部のイベントユーザー プロパティを自動的に記録します。それらを有効にするためにコードを追加する必要はありません。

あなたが始める前に

まだ行っていない場合は、JavaScript プロジェクトに Firebase を追加し、Firebase プロジェクトで Google アナリティクスが有効になっていることを確認します。

  • 新しい Firebase プロジェクトを作成する場合は、プロジェクト作成ワークフローで Google アナリティクスを有効にします。

  • Google アナリティクスが有効になっていない既存の Firebase プロジェクトを使用している場合は、 の [統合] タブ > [プロジェクト設定] に移動して有効にします。

プロジェクトで Google アナリティクスを有効にすると、Firebase ウェブアプリは、アプリ + ウェブ プロパティに関連付けられた Google アナリティクス データ ストリームにリンクされます。

Analytics SDK をアプリに追加する

ウェブ アプリケーションのホスト方法によっては、構成が自動的に処理されるか、 Firebase 構成オブジェクトの更新が必要になる場合があります。ウェブアプリで既に Google アナリティクスを使用している場合は、既存の gtag.js タグ付けで Firebase を使用するで説明されている追加の設定が必要になる場合があります。

  1. コード内の Firebase 構成オブジェクトにmeasurementIdが含まれていることを確認してください。この ID は、Firebase プロジェクトで Analytics を有効にしてウェブアプリを登録すると自動的に作成され、Analytics を使用するために必要です。

    • アプリで Firebase Hosting使用し、Firebase SDK 用に予約済みの URLを使用している場合:

      Firebase は、アプリケーションの構成を自動的に処理します。セットアップを完了するには、プロジェクト設定のアプリカードからスクリプトをアプリの <body> タグに追加します (まだ行っていない場合)。

    • アプリで予約済み URL を使用していない場合:既存のウェブアプリを使用している場合は、コード内の 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 version 9

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 version 8

import firebase from "firebase/app";
import "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
firebase.initializeApp(firebaseConfig);


// Initialize Analytics and get a reference to the service
const analytics = firebase.analytics();

既存の gtag.js タグ付けで Firebase を使用する

以前にgtag.js スニペットを使用してアプリで Google アナリティクスを実行していた場合、次のいずれかを行う予定であれば、アプリに追加の設定が必要になることがあります。

  • Firebase からの Google Analytics 呼び出しをページに追加しますが、同じページで直接gtag()呼び出しを引き続き使用する予定です。
  • gtag()の直接呼び出しと Firebase に送信される Google アナリティクス データの両方で同じ測定 ID を使用したい。

イベントがすべての Firebase サービスで使用できるようにするには、次の追加のセットアップ手順を完了します。

  • gtag('config', ' GA_MEASUREMENT_ID ');削除します。ここで、 GA_MEASUREMENT_IDは Firebase ウェブアプリのmeasurementIdです。ページ上の他の Analytics プロパティに別の ID がある場合、それらの構成行を削除する必要はありません。
  • gtag() でイベントを送信する前に、 gtag() firebase.analytics()呼び出してください。

そうしないと、 gtag()呼び出しでその ID に送信されたイベントが Firebase に関連付けられず、他の Firebase サービスでのターゲティングに使用できなくなります。

イベントのログ記録を開始

Analytics サービスを初期化したら、 logEvent()メソッドを使用してイベントのログ記録を開始できます。

すべてのアプリで特定のイベントが推奨されます。その他は、特定のビジネス タイプまたは業種に推奨されます。レポートで利用可能な最大の詳細を確保し、利用可能になった将来の機能と統合から利益を得るために、推奨されるイベントを所定のパラメータとともに送信する必要があります。このセクションでは、事前定義されたイベントのログ記録について説明します。イベントのログ記録の詳細については、ログイベント を参照してください。

次の例は、推奨イベントをログに記録して、ユーザーがアプリで通知を受け取ったことを示す方法を示しています。

Web version 9

import { getAnalytics, logEvent } from "firebase/analytics";

const analytics = getAnalytics();
logEvent(analytics, 'notification_received');

Web version 8

firebase.analytics().logEvent('notification_received');

次のステップ