GA4やGTM(Googleタグマネージャー)で新しくイベント設定をしたが「本当に正しく計測できているのだろうか」と感じたことはないだろうか。
そんなときに役立つのが、GA4の動作検証ツール「DebugView(デバッグビュー)」の出番だ。
本記事では、DebugViewの基本的な概要からメリット、具体的な利用方法、表示されないときの対処法まで、初心者の方にもわかりやすく解説する。
GA4のDebugViewとは?
DebugViewとは、Webサイトやアプリで発生したイベント(ユーザー行動)をほぼリアルタイムで確認できるGA4の機能のことをいう。
タイムラインに沿って、いつ・どのようなイベントが発生し、どのようなイベントパラメータが紐づいているのかを詳細に確認できる。

リアルタイムレポートとDebugViewの違い
サイト内で発生したイベントをリアルタイムで確認する方法として、DebugViewのほかにも「リアルタイムレポート」があるが、リアルタイムレポートは以下のような制約がある。
DebugViewでは、「デバッグが有効化された状態(DebugViewの利用方法で後述)」のデータだけが記録され、その間はどれだけ時間が経ってもデータが残り続けるが、リアルタイムレポートでは、サイトに訪れたすべてのユーザーのデータが記録され、なおかつ過去30分までしかさかのぼれないようになっている。
そのため、見たいデータだけにしぼって確認したい場合や、セッションが切れた後の動作確認などは、リアルタイムレポートでは難しい。
DebugViewの利用シーンとメリット
GA4のDebugViewを利用するシーンとして、おもに以下3つのケースがある。
設定したイベントが正しく計測できているかをすぐに確認したいとき
GA4やGTMを利用して新しくイベント計測を行ったあとは、本当に正しく計測できているのかを確かめる必要がある。設定不備があった場合、きちんとデータが計測されなかったり、おかしなデータが溜まってしまったりするからだ。
ただし通常のレポートでは、データの反映に数時間〜1日以上かかることがあるため、計測設定したイベントのデータがGA4に正しく飛んでいるかを検証するのに時間がかかる。
そんなときにDebugViewを使えば、ほぼリアルタイム(イベント発生の5秒後ぐらいの時間差)で記録されたデータを確認できるため、動作確認がすばやく行える。
計測不備があるかを確認したいとき
GA4で分析していると、ときどき「計測不備が起きているのではないか」と思うときがある。一番多いのは、取れているはずのデータがレポート上で確認できない場合だ。
ただし、もしかしたら本当にそのイベントが発生していないだけの可能性も否定できない。
そんなときにDebugViewで確認すれば、計測不備が起きているのか、それともただデータが溜まっていないだけなのかがわかる。実際にサイト上で操作してみて、DebugViewでイベントが確認できなければ、明らかに計測不備が起きているため、イベントの設定を見直す必要がある。
どのようなイベントが計測できているかを確認したいとき
サイトでどのようなイベントが計測されているかを確認する際は、ふつうはGA4の管理画面やGTMを見ることが多いが、過去に設定したものが多く、名前の付け方や管理方法がルール化されていないと、何が何だかわからなくなる。
サイトのどのページで・何を・どうしたときに・どのようなイベントが発生するかを、一覧表などできちんとまとめられていればわかりやすいが、なかなかそこまで管理できているケースは少ないし、サイトの担当者が変われば管理もだんだん煩雑になるため、すべての設定内容を紐解いていくのはかなり骨が折れる作業になるだろう。
そんなときは、DebugViewを使ってどのタイミングでどのようなイベントが発生するかを逐一見ていったほうが早い場合が多い。自分でサイトを操作し、都度発生するイベントとイベントパラメータを確認していくやり方なので少々面倒ではあるが、それでも設定がぐちゃぐちゃのGTMやGA4を1つ1つ細かく見ていくよりかは明快でわかりやすい。
GA4やGTMの管理ができていないのはそれはそれで問題なので、いずれにしろいつかは設定内容を明確にしておくべきだが、とりあえずどのようなイベントがサイトで計測されているかを確認するだけであればうってつけのやり方である。
DebugViewの利用方法
DebugViewの画面自体は、GA4管理画面>「DebugView」の順にクリックすることで見れる。

ただし、そのままでは何も起こらないため、以下2つのうちいずれかの作業が必要になる。
方法1.Chrome拡張機能「Google Analytics Debugger」を利用する
「GTMを使用していない、または、権限が与えられておらず使用できない」「GTMの操作に慣れていない」という方はこちらの方法をオススメする。
まず、「Google Analytics Debugger」をインストールする。インストールしたら、拡張機能のエリアに固定しておこう。
次に計測対象のサイトを開き、先ほどインストールした拡張機能をクリックし、「ON」にする。

これで数秒後にDebugViewの画面にアイコンが表示されるようになるはずだ。
方法2.GTMのプレビュー機能を利用する
計測対象サイトに設置されているGTMタグのワークスペースを開き、画面右上の「プレビュー」をクリックする。

つづいて表示されるポップアップの下部に「URLにデバッグシグナルを含める」とあるのでチェックが入っていることを確認し(通常はデフォルトでチェックが入っている)、リンクする。

DebugViewの確認方法
DebugViewのタイムライン上にイベントが表示されるようになったら、それらをクリックしてみよう。すると、そのイベントに紐づくイベントパラメータが表示され、さらにそれをクリックすると、イベントパラメータに格納されている値を確認できる。
以下では、page_viewイベントに紐づくpage_locationというイベントパラメータの値を確認している。

自身がサイトで何かしらのアクションを行ったときに、意図したイベント名・イベントパラメータ名・値が正しく発生していれば、計測は問題ないということになる。
なお、アイコンはどんどん上から下へと流れていくため、特に確認したいイベントがあれば、右側の「上位のイベント」のボックスを利用するといい。
イベント名をクリックすると、同じようにイベントパラメータを確認できるし、いつ発生したかもコンパクトにまとめられているためわかりやすい。

DebugViewにアイコンが表示されないときのよくある原因
デバッグを有効化してから少し待ってもDebugViewにイベントのアイコンが表示されない場合、以下が原因である可能性が高い。
内部トラフィックを除外している
GA4で、社内IPアドレスからのアクセスを除外設定しているケースが考えられる。
GA4管理画面>「データフィルタ」の順にクリックし、内部トラフィックのフィルタが「有効」になっていれば、「無効」に変更しよう。


ただしDebugViewを使い終わった後は、ふたたびフィルタを「有効」にすることをお忘れなく。
自身のアクセスをオプトアウトする拡張機能やツールを使っている
GA4側で設定していなくても、拡張機能や特定のツールを使って自身のアクセスを除外している場合もよくある原因の1つ。それらの設定を今一度確かめてみよう。
見ているGA4プロパティが間違っている
対象サイトに、DebugViewを操作するGA4プロパティの計測IDが入っていないと、当然ながらDebugViewは動作しない。
当たり前のようにわかっていても、複数のGA4プロパティを同時に開いていると、このようなシンプルなミスは意外と起こりやすいので、今一度確かめる必要がある。
おわりに
GA4のDebugViewは、イベント計測の設定確認やトラブルシューティングを行ううえで欠かせない機能であることが分かったと思う。
リアルタイムレポートでは確認しづらい自身の操作だけのデータを、タイムライン形式で細かくチェックできるため、「イベントが飛んでいない」「数値がおかしい」といった悩みを効率よく解決できる。
まだ使ったことがない方は、GA4を正しく活用するためにもぜひDebugViewを日常的な検証フローに取り入れてみてほしい。


