概要
GA4のイベントの送信について、Google ChromeのNetworkパネルでは捕捉できないケースがあるようです。
検証環境
- macOS Monterey (Intel)
- Google Chrome v106
フロントの実装
- Google Tag ManagerでGoogle Analytics 4、Universal Analyticsを配信
-
target="_self"でページ遷移させる
gtag.jsの読み込み
<script async src="https://www.googletagmanager.com/gtag/js?id=MEASUREMENT_ID"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'MEASUREMENT_ID');
</script>
gtm.jsの読み込み
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBe
fore(j,f);
})(window,document,'script','dataLayer','CONTAINER_ID');</script>
aタグの違い
捕捉できないパターン
<a href="detail.html">リンク</a>
捕捉できるパターン
<a href="detail.html" target="_blank">リンク</a>
GTMの設定
リンククリックをトリガーとして、UA、GA4それぞれでイベントを飛ばす。
Google Analytics 4
Universal Analytics
結果
以下のような結果となり、「Google ChromeでのGA4のイベント計測」に限定してログが確認できないことが分かりました。
パケットキャプチャの生ログからはGA4でもログが飛んでいることがわかるので、単純に「Chrome側で捕捉できていないだけ」ということになります。
| 検証パターン | Universal Analytics | Google Analytics 4 |
|---|---|---|
| Google ChromeのNetworkパネル | ○ | × |
| SafariのNetworkパネル | ○ | ○ |
| パケットキャプチャ | ○ | ○ |
target="_blank" |
○ | ○ |
| GTMのプレビューモード | ○ | ○ |
| Google AnalyticsデバッガーをON ※ | ○ | ○ |
※Chrome拡張のGoogle AnalyticsデバッガーをONにした状態
なぜかGTMのプレビューモードであったり、GAデバッガーを有効にしている場合には回避できますので、もし同様の事象に遭遇したら
- Chrome以外のブラウザで確認する
- GTMのプレビューモードをONにする
- GAデバッガーをONにする
- パケットキャプチャを利用する
のいずれかの選択肢を選べばいいのかなと思います。