このクイックスタートでは、Google アナリティクスをアプリに追加し、イベントのログ記録を開始する方法を示します。
Google アナリティクスは、アプリの使用状況と行動に関するデータを収集します。 SDK は、主に次の 2 種類の情報をログに記録します。
- イベント:ユーザー アクション、システム イベント、エラーなど、アプリで発生していること。
- ユーザー プロパティ:言語設定や地理的位置など、ユーザー ベースのセグメントを説明するために定義する属性。
Analytics は一部のイベントとユーザー プロパティを自動的に記録します。それらを有効にするためにコードを追加する必要はありません。
あなたが始める前に
まだ行っていない場合は、JavaScript プロジェクトに Firebase を追加し、Firebase プロジェクトで Google アナリティクスが有効になっていることを確認します。
新しい Firebase プロジェクトを作成する場合は、プロジェクト作成ワークフローで Google アナリティクスを有効にします。
Google アナリティクスが有効になっていない既存の Firebase プロジェクトを使用している場合は、 統合] タブ > [プロジェクト設定] に移動して有効にします。
の [
プロジェクトで Google アナリティクスを有効にすると、Firebase ウェブアプリは、アプリ + ウェブ プロパティに関連付けられた Google アナリティクス データ ストリームにリンクされます。
Analytics SDK をアプリに追加する
ウェブ アプリケーションのホスト方法によっては、構成が自動的に処理されるか、 Firebase 構成オブジェクトの更新が必要になる場合があります。ウェブアプリで既に Google アナリティクスを使用している場合は、既存の gtag.js タグ付けで Firebase を使用するで説明されている追加の設定が必要になる場合があります。
コード内の 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" };
Firebase JS SDK をまだインストールしていない場合は、インストールして Firebase を初期化します。
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');
次のステップ
- DebugViewを使用してイベントを確認します。
- Firebase コンソールでデータを探索します。
- イベントとユーザー プロパティに関するガイドをご覧ください。
- データをBigQuery にエクスポートする方法を学びます。
このクイックスタートでは、Google アナリティクスをアプリに追加し、イベントのログ記録を開始する方法を示します。
Google アナリティクスは、アプリの使用状況と行動に関するデータを収集します。 SDK は、主に次の 2 種類の情報をログに記録します。
- イベント:ユーザー アクション、システム イベント、エラーなど、アプリで発生していること。
- ユーザー プロパティ:言語設定や地理的位置など、ユーザー ベースのセグメントを説明するために定義する属性。
Analytics は一部のイベントとユーザー プロパティを自動的に記録します。それらを有効にするためにコードを追加する必要はありません。
あなたが始める前に
まだ行っていない場合は、JavaScript プロジェクトに Firebase を追加し、Firebase プロジェクトで Google アナリティクスが有効になっていることを確認します。
新しい Firebase プロジェクトを作成する場合は、プロジェクト作成ワークフローで Google アナリティクスを有効にします。
Google アナリティクスが有効になっていない既存の Firebase プロジェクトを使用している場合は、 統合] タブ > [プロジェクト設定] に移動して有効にします。
の [
プロジェクトで Google アナリティクスを有効にすると、Firebase ウェブアプリは、アプリ + ウェブ プロパティに関連付けられた Google アナリティクス データ ストリームにリンクされます。
Analytics SDK をアプリに追加する
ウェブ アプリケーションのホスト方法によっては、構成が自動的に処理されるか、 Firebase 構成オブジェクトの更新が必要になる場合があります。ウェブアプリで既に Google アナリティクスを使用している場合は、既存の gtag.js タグ付けで Firebase を使用するで説明されている追加の設定が必要になる場合があります。
コード内の 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" };
Firebase JS SDK をまだインストールしていない場合は、インストールして Firebase を初期化します。
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');
次のステップ
- DebugViewを使用してイベントを確認します。
- Firebase コンソールでデータを探索します。
- イベントとユーザー プロパティに関するガイドをご覧ください。
- データをBigQuery にエクスポートする方法を学びます。