このセクションでは、Google アナリティクス 4 でシングルページ アプリケーションを追跡する方法を紹介します。
シングルページアプリケーションとは？
シングルページアプリケーション（SPA）とは、サーバーから新しいページを再読み込みするのではなく、現在のページを動的に書き換えることでユーザーとやり取りするウェブアプリケーションまたはウェブサイトのモデルです。
ユーザーがページにアクセスすると、URLは変更されますが、ページ自体は再読み込みされません。この方法により、ページ間の切り替えによるユーザーエクスペリエンスの中断が回避され、アプリケーションはデスクトップアプリケーションに近いものになります。
従来のウェブサイトでは、GA4ではページが読み込まれるたびにpage_viewイベントがトリガーされますが、SPAではページが更新されないため、「仮想ページ閲覧」などのユーザーインタラクションを正しく記録するには、GA4で追加の設定が必要です。
GA4 で SPA をトラッキングする際の課題
SPA において GA4 が直面する一般的なトラッキングの問題には、以下のものがあります。
- ページビューが記録されない：ページが再読み込みされないため、GA4 のデフォルトの page_view イベントは最初の読み込み時にのみトリガーされ、その後のページコンテンツの変更は自動的に記録されません。
- 不正確な URL とページタイトル：SPA は pushState を通じて URL を更新する場合がありますが、GA4 はデフォルトで document.location.pathname を使用するため、完全な URL や正しいページタイトルが取得されない可能性があります。
- セッションとリファラーの問題（Rogue referrer）：SPA が正しく設定されていない場合、セッションデータが破損したり、リファラーデータが不正確になったりして、ユーザージャーニー分析に影響を与える可能性があります。
- イベントの重複または省略：自動トラッキング（拡張計測など）により、ページビューイベントが重複してカウントされたり、トリガーされなかったりすることがあります。
Web サイトが単一ページのアプリケーションかどうかを確認する方法
ページ A からクリックして、GTM のプレビュー モードでページ B にアクセスできます。このプロセス中に、Tag Assistant がページをリロードしたかどうかを確認します。リロードされた場合、それは単一ページのアプリケーションではありません。リロードされていない場合は、多くの履歴が表示される単一ページのアプリケーションです。
プレビューする前に、このトリガー条件を有効にする必要があります.GTMで、「トリガー」——「新規 」——「トリガーのタイプを選択して設定を開始… 」——「履歴の変更」をクリックし、次のようにします。設定：
次に [プレビュー] をクリックし、任意のページをクリックして、Tag Assistant を視聴します:
履歴は、単一ページのアプリケーションである Tag Assistant に表示されます。
シングルページアプリ向けの拡張計測機能
GA4 の拡張計測機能は、シングルページアプリ（SPA）をトラッキングする最もシンプルな方法の一つです。
この機能はデフォルトで有効になっており、ページビュー、スクロール、クリック、ファイルのダウンロードなどのイベントを自動的にキャプチャします。SPAの場合、拡張計測機能はブラウザの History API（pushState および replaceState）をリッスンすることで URL の変更を検出し、page_view イベントをトリガーします。
実装手順
Google アナリティクス 4 で、[管理] —— [データ ストリーム] —— [すべて] —— [拡張計測機能] をクリックして、拡張評価イベントの設定インターフェイスを表示します：
「ページビュー数」の「詳細設定を表示」をクリックすると、「ブラウザの履歴イベントに基づくページの変更」オプションが表示されるので、チェックを入れて保存します。
これでシングルページアプリのトラッキング設定は完了です。
GTM プレビュー モードの History の API Call に gtm.historyChange-v2 が表示される場合は、追跡されたことを意味します。
メリット
- 使いやすい：追加のコーディングは不要です。
デメリット
- URLとページタイトルが不正確：ページタイトルやパラメータをカスタマイズできず、事前に設定されたdocument.location.pathnameに依存します。
適用可能なシナリオ
拡張評価は、URLの変更がページコンテンツの更新に直接関連し、ページタイトルやパラメータをカスタマイズする必要が少ないシンプルなSPAに適しています。
