サーバー側 Google タグ マネージャーにデータを送信する

この記事では、サーバー側のコンテナにイベントを送信するさまざまな方法について説明します。この記事の手順を開始する前に、まずサーバー側のタグ設定を行ってください。

この記事では、以下の手順を説明します。

  • ウェブサイトからサーバー側のコンテナにデータを送信する
  • サーバー側のコンテナでデータを受信する
  • ファーストパーティのエンドポイントから Google アナリティクス スクリプトを読み込む
  • Google アナリティクス 4 タグを使って追加のデータをサーバー コンテナに送信する
  • ウェブサイト以外のソースからデータを送信する

ウェブサイトの構成

タグ マネージャーまたはグローバル サイトタグ(gtag.js)を使用して、サーバー側へデータを送信できます。

タグ マネージャー

サーバー側構成を介してデータが転送されるようにサポート対象のタグを設定するには、[トランスポート URL を設定] を使用します。トランスポート URL には、ファースト パーティ ドメインのエンドポイントを指定します。

サーバー側で処理されるようにタグを設定するには、トランスポート URL を追加します。

Google アナリティクス 4

  1. ウェブ用コンテナで、GA4 設定タグを追加するか、既存のタグを編集します。
  2. [詳細設定] > [設定フィールド] をクリックします。
  3. 次のフィールド名と値を追加します。
  4. フィールド名: transport_url
  5. 値: https://<DOMAIN_NAME>DOMAIN_NAME はタグ設定サーバーのドメイン名)
  6. タグを保存し、すべてのページで発生するようにトリガーを設定します。
  7. コンテナを公開します。

ユニバーサル アナリティクス

  1. ウェブ用コンテナで、ユニバーサル アナリティクス タグを追加して、Google アナリティクス設定変数を指定するか、既存のユニバーサル アナリティクスの設定を使用します。
  2. [詳細設定] に移動します。
  3. [トランスポート URL を設定] チェックボックスをオンにします。
  4. タグ設定サーバーの URL を [トランスポート URL] フィールドに追加します(例: https://<DOMAIN_NAME>DOMAIN_NAME はタグ設定サーバーのドメイン名)。
  5. タグを保存し、すべてのページで発生するようにトリガーを設定します。
  6. コンテナを公開します。

グローバル サイトタグ(gtag.js)

ウェブサイトで gtag.js を使っている場合は、ユニバーサル アナリティクスまたは Google アナリティクス 4 の config コマンドを更新して、タグ設定サーバーにイベントを送信します。

GA4 タグと UA タグの両方について、既存のタグに transport_url パラメータを追加します。

gtag('config', '<MEASUREMENT_ID>', {
  transport_url: 'https://analytics.example.com'
});

<MEASUREMENT_ID> を、Google アナリティクス 4 またはユニバーサル アナリティクスの ID に置き換えます。https://analytics.example.com を、タグ設定サーバーの URL に置き換えます。

サーバー側クライアントの設定

トランスポート URL を設定すると、タグ マネージャーのサーバー側コンテナへデータが送信されるようになります。デフォルトでは、GA4 と UA のクライアントがサーバー側のコンテナにプリインストールされています。

タグ マネージャーのサーバー用コンテナで、左側のナビゲーションにある [クライアント] をクリックすると、クライアントのリストが表示されます。詳細を表示または編集するクライアントの名前をクリックします。ほとんどの場合、クライアントを変更する必要はありませんが、状況によっては、以下の設定の編集が必要になります。

  • 優先度: クライアントの実行順序を指定します。数字が大きいものが最初に実行され、受信したリクエストに一致する最初のクライアントが、そのリクエストのアクティブなクライアントとなります。

  • 有効化の条件: クライアントがリクエストに応答する条件を指定します。

    • ユニバーサル アナリティクスのデフォルトのパス: リクエストのパスに /collect/r/collect が含まれている場合、または JavaScript ファイルが Google アナリティクスへデータを送信するために使用する同様のパスが含まれている場合、クライアントが有効化されます。デフォルトでは、この設定が適用されます。

    • 特定の ID 向けのデフォルトの gtag.js パス: サーバー側タグ設定 URL を使用した gtag.js JavaScript 配信が有効になります。この設定を選択すると、デフォルトの gtag.js リクエストパス(/gtag/js?id=<MEASUREMENT_ID>など)へのリクエストに応答して、このクライアントが有効になります。[測定 ID を追加] をクリックして、1 つ以上の Google アナリティクス測定 ID を追加します。

Google スクリプトを読み込む

サーバー側タグ設定のメリットを最大限に活用するには、サーバー側タグ設定を使用して、サポートされているスクリプトを読み込みます。これにより、サードパーティ ドメインへの依存を減らすことができます。

gtag.js ソースドメインを更新する

gtag.js をインストールすると、デフォルト構成により、www.googletagmanager.com から Google アナリティクス ライブラリが読み込まれます。サーバー側タグ設定を使用してアナリティクス コードを読み込むには、このドメイン名を、サーバー側タグ設定のドメインに変更します。

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://<DOMAIN NAME>/gtag/js?id=<GA_MEASUREMENT_ID>"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', '<GA_MEASUREMENT_ID>');
</script>

クライアントの構成

Google アナリティクス スクリプトの読み込みがリクエストされたとき、サーバー側タグコンテナが応答できるようにするには、クライアントを一部変更する必要があります。

  1. サーバー側コンテナで [クライアント] をクリックし、クライアントをリスト表示します。
  2. 編集するクライアントの名前をクリックします。
  3. [特定の ID 向けのデフォルトの gtag.js パス] を選択します。
  4. [測定 ID を追加] をクリックして、ID を入力します。
  5. クライアントの設定を保存し、コンテナを公開します。

gtm.js ソースドメインを更新する

ウェブサイトに gtm.js をインストールすると、デフォルト構成により、www.googletagmanager.com から Google タグ マネージャー ライブラリが読み込まれます。サーバー側タグ設定を使用して GTM コードを読み込むには、このドメイン名を、gtm.js スクリプトと ns.html ファイルの両方で、サーバー側タグ設定のドメイン名に変更します。

gtm.js と ns.html の挿入に関する Google タグ マネージャー スニペットのスクリーンショット

クライアントの構成

Google タグ マネージャー スクリプトの読み込みがリクエストされた際にサーバー側タグ設定コンテナが応答できるようにするには、Google タグ マネージャー: ウェブコンテナのクライアントを追加し、設定に変更を加えます。

  1. サーバー側コンテナで [クライアント] をクリックし、クライアントをリスト表示します。
  2. [クライアント] セクションで [新規] をクリックします。
  3. [クライアントの構成] セクションをクリックして、クライアントの種類を選択します。
  4. 利用可能なクライアントの一覧から [Google タグ マネージャー: ウェブコンテナ] を選択します。
  5. [コンテナ ID を追加] をクリックし、Google タグ マネージャー ウェブコンテナ ID を入力します。この ID は、上記の HTML スニペットで使用した ID と一致する必要があります。
  6. クライアントの設定を保存し、コンテナを公開します。

他のタグの追加データを含める

サーバーに同様のデータを送信する複数のタグをページにインストールしている場合は、個別のタグを使用する代わりに、タグ マネージャーや gtag.js で Google アナリティクス 4 タグを使って、そのデータをサーバー側のタグ設定インストールにルーティングすることをおすすめします。タグで追加のイベント パラメータを指定し、それからサーバー側コンテナで変数を使ってパラメータを抽出することができます。これにより、ページ上の JavaScript の量を減らし、HTTP リクエストの数を最小限に抑えることができるため、ウェブサイトのパフォーマンスが向上します。

タグ マネージャー

固有の ID など、すべてのイベントで送信するパラメータがある場合は、Google アナリティクス 4 設定タグの [設定フィールド] に追加します。

  1. ウェブ用コンテナで、Google アナリティクス 4 設定タグを追加するか、既存のタグを編集します。
  2. [設定フィールド] > [行を追加] をクリックします。
  3. すべてのイベントに表示するパラメータをパラメータ名 / 値テーブルに追加します。
  4. [すべてのページ] を対象に配信されるようにトリガーを設定し、タグを保存します。

一部のイベントで送信するパラメータがある場合は、Google アナリティクス 4 イベントタグの [イベント パラメータ] セクションでそのパラメータを追加します。

  1. ウェブ用コンテナで、Google アナリティクス 4 イベントタグを追加するか、既存のタグを編集します。
  2. [イベント パラメータ] > [行を追加] をクリックします。
  3. パラメータをパラメータ名 / 値テーブルに追加します。
  4. トリガーを設定して、タグを保存します。

gtag.js

gtag API では、追加のパラメータをコマンド パラメータとして含めることで指定できます。詳しくは、gtag.js API リファレンスをご覧ください。

すべてのイベントで送信するパラメータを設定するには:

gtag('config', '<GA_MEASUREMENT_ID>', {
  'transport_url': 'https://analytics.example.com'
  'custom_parameter': 'value',
});

特定のイベントで送信するパラメータを設定するには:

gtag('event', 'event_name', {
  'custom_parameter': 'value',
});

page_view イベントのみで送信されるパラメータを設定するには、false の値を持つ send_page_view パラメータを config コマンド内に追加し、個別の page_view イベントを追加します。

gtag('config', 'G-123456789', {
  'transport_url': 'https://analytics.example.com'
  'send_page_view': false,
});
gtag('event', 'page_view', {
  'custom_parameter': 'value',
});

サーバー側 Google タグ マネージャーで追加データを受信する

サーバー コンテナでは、Google アナリティクス 4 クライアントによって追加のパラメータが解析され、イベントデータに設定されます。このデータを他のタグで使用するには、イベントデータ変数を作成し、キーパスにパラメータ名を指定することをおすすめします。こうすることで、パラメータを必要とするタグでこの変数を使用できるようになります。

他のソースからデータを送信する

Google アナリティクスの Measurement Protocol を使用すると、モバイルアプリやサーバー間アプリケーションなどのデータをタグ設定サーバーへ送信できるようになります。

モバイルアプリ

Android アプリまたは iOS アプリからタグ設定サーバーへデータを送信するには、カスタム画像タグを作成し、Measurement Protocol を使用するように設定します。

  1. モバイル用コンテナ(Android または iOS)で、[タグ] > [新規] をクリックします。
  2. [タグの設定] で、タグタイプとして [カスタム画像] を選択します。
  3. [画像の URL] として、前に指定した Measurement Protocol クライアントのパスにあるタグ設定サーバーのピクセル画像を設定します。ピクセル URL の末尾に任意の Measurement Protocol パラメータを追加します。
    https://custom.example.com/app?v=1&tid=UA-XXXXX-Y&cid=555&t=screenview&an=myApp&version=1.6.2&aid=com.foo.myapp&cd=home
  4. [キャッシュ無効化を有効にする] チェックボックスをオフにします。
  5. タグを保存し、コンテナを公開します。
  6. サーバー側コンテナで、[クライアント] > [新規] をクリックします。
  7. [クライアントの構成] で、クライアントの種類として [Measurement Protocol] を選択します。
  8. [アクティベーション パス] として、アプリのコレクション エンドポイントのパスを設定します。
  9. クライアントの設定を保存し、サーバー側コンテナを公開します。

サーバー間アプリ

Measurement Protocol データをタグ設定サーバーへ送信するには、www.google-analytics.com ホスト名をタグ設定サーバーのドメイン名に置き換えます。次に例を示します。

POST /batch HTTP/1.1
Host: collection.example.com

v=1&tid=UA-XXXXX-Y&cid=555&t=screenview&an=myApp&version=1.6.2&aid=com.foo.myapp&cd=home

Measurement Protocol のヒットを受信するには、Measurement Protocol クライアントを使用して Google タグ マネージャーのサーバー側コンポーネントを設定します。

  1. サーバー側コンテナで、[クライアント] > [新規] をクリックします。
  2. [クライアントの構成] で、クライアントの種類として [Measurement Protocol] を選択します。
  3. [アクティベーション パス] として、サーバーのエンドポイントのパスを設定します。
  4. クライアントの設定を保存し、コンテナを公開します。