search
LoginSignup
5

More than 1 year has passed since last update.

posted at

updated at

Organization

Googleアナリティクスはどうやってアクセスを解析しているのか

Googleアナリティクスはどうやってアクセスを解析しているのか

by nouka
1 / 25

Googleアナリティクスとは


Googleアナリティクスとは

Googleが開発したウェブビーコン型のアクセス解析ツール(以下GA)。

参照:Googleアナリティクス - ガイド


ウェブビーコン型とは

Untitled.png


GAでは複数のメカニズムを選択可能

  • new Image()
  • new XMLHttpRequest()
  • navigator.sendBeacon

上記から、ブラウザの対応状況に応じて最適なものを採用する。


navigator.sendBeacon

  • フォームを送信するなどでページの表示を終了すると、JavaScriptの実行も強制終了するため、ヒットが送信されない問題がある。
  • sendBeaconはこの問題に対応できる。

hitCallback

  • 非対応ブラウザのためにhitCallback関数を定義することもできる。
  • タイムアウトを設定しておかないと、フォームが送信されないなどの不具合が起こるため注意。

hitCallbackの例

var form = document.getElementById('signup-form');
form.addEventListener('submit', function(event) {
  event.preventDefault(); // フォームの送信をストップ。
  setTimeout(submitForm, 1000); // フォーム送信を遅延して行う。
  var formSubmitted = false;
  function submitForm() { // フォームを送信する関数。2回送信されないようにしている。
    if (!formSubmitted) {
      formSubmitted = true;
      form.submit();
    }
  }
  ga('send', 'event', 'Signup Form', 'submit', {
    hitCallback: submitForm // ヒットが送信されたらフォームを送信する。
  });
});

GAのトラッキングコードの解説

<!-- Google Analytics -->
<script>
// 1.analytics.jsのロードとgaコマンドキューの初期化
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto'); // 2.トラッカー生成
ga('send', 'pageview'); // 3.最初のページビューを送信
</script>
<!-- End Google Analytics -->

gaコマンドキューとは

  • gaという名前の関数。引数を配列にpushする。
  • analytics.jsがロードされると、配列にたまっている引数のリストを処理した後、再定義される。
  • その後は即時データを送信する関数として動作する。

analytics.jsがロードされるタイミングを意識しなくても良い。


トラッカーとは

  • データを収集しGAに送信するためのオブジェクト。
  • トラッキングIDやCookieの保存先ドメインを指定することができる。
  • Cookieの保存先にautoを指定すると、できる限り上位のドメインを選択する(blog.example.co.jpの場合は.example.co.jpに設定される)。

ヒットとは

  • ページビューなどのデータをGAに送信すること。
  • 1件のデータ送信で1ヒットとなる。
  • ヒット数には上限がある。
  • ヒット数の大きくなりがちなサイト速度の計測は、サンプル数がデフォルトでは全体の1%に制限されている。

ヒットの上限

プロパティ ユーザー セッション
1,000万ヒット/月 20万ヒット/日 500ヒット/回
  • プロパティの上限を超えるとGoogleから連絡が来る。
  • ユーザーとセッションの上限を超えると、当日集計されずレポートが遅れる。

ユーザー、セッション、ページビュー


ユーザー

  • トラッカーを生成する際に、クライアントIDと呼ばれる一意な値を生成しCookieに埋め込む。
  • このクライアントIDが同一であれば、同一ユーザーとして扱われる。
  • CookieにクライアントIDがすでに存在していれば「Returning Visitor」として扱われ、なければ「New Visitor」として扱われる。
  • Cookieはデフォルト2年間有効だが、アクセス時に期限が延長される。

ユーザー

  • UserIDという機能を使うと、任意の値をCookieに設定できる(会員IDなど)。
  • 端末を超えて同一のユーザーとして計測できる。

セッション

  • 特定の期間にウェブサイトで発生した一連の操作のこと。
  • 1回のセッションには、複数のページビュー、イベント、ソーシャル インタラクション、eコマーストランザクションなどが含まれる。

image

引用:https://support.google.com/analytics/answer/2731565


セッション

セッションは以下の条件で終了し、次のセッションは新しいセッションとして扱われる。

  1. 時間による期限切れ
    • 操作が行われない状態で30分経過後。
    • 午前0時。
  2. キャンペーンの切り替わり
    • キャンペーン経由でサイトにアクセスして離脱した後、別のキャンペーン経由でサイトに戻ってきた場合。

ページビュー

  • ページへの1アクセスのこと。
  • ga('send', 'pageview')で送信できる。
  • ページの表示でなくても送信できる(仮想ページビューと呼ぶ)が、不用意に使うとデータがめちゃくちゃになるので、通常はイベントなどの別のヒットタイプを利用する。
  • ヒットタイプには「pageview, screenview, event, transaction, item, social, exception, timing」がある。

開発の際のTIPS


データを改変してしまう操作

  • IPやドメインなどのフィルタ操作。
  • 仮想ページビュー、イベント、eコマーストランザクションなどのヒットの操作。
  • コンバージョントラッキングなどの、特定のセッション条件を特別に記録するケース。
  • 上記のような操作は検証環境でテストが必要。

デバッグモード

  • https://www.google-analytics.com/analytics_debug.jsをロードすることでデバッグモードになる。
  • Google Analytics DebuggerというChrome拡張を使えば、デバッグモードになっていないページもデバッグモードにできる。

スクリーンショット 2020-01-14 23.44.30.png


ドライラン

  • デバッグモード環境下でga('set', 'sendHitTask', null)を設定すると、ヒットを送信せずに実装をテストすることができる。
  • gaコマンドキューが呼び出される前にwindow.ga_debug = {trace: true}すると、トレースも表示できる。
// 例
window.ga_debug = {trace: true}; // トレースを有効化。
ga('create', 'UA-XXXXX-Y', 'auto');
if (location.hostname == 'localhost') {
  ga('set', 'sendHitTask', null); // localhostではヒットを送信しない。
}
ga('send', 'pageview');

デバッグツール

  • Google Tag AssistantというChrome拡張を使えば、ページをレコードしてどんなヒットが送信されているのか確認できる。

まとめ

  • Googleアナリティクスがどのような動作をするのか知ることは、トラブルシューティングの際に役立つと思います。
  • 特にデータを改変する操作の際は、注意が必要です。
  • 実装を確認するためのツールもあるので、活用しましょう。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
5