06.Google Analyticsのクロスドメイン対応を自動化

サンクトガーレンのサイトは、複数のドメインで構成されています。

• 本サイト (www.sanktgallenbrewery.com)
• 旧ショップ (tsst.securesites.net)
• 新ショップ (sanktgallen.shop-pro.jp)
• ブログ (sweetsbeer.cocolog-nifty.com)

Google Analyticsは、それぞれのドメインに対してのみ情報を保存できる1stパーティCookieを使って、ユーザー（ブラウザ）ごとに値が異なるランダムなIDを保存しています。そのため、ドメインが複数あるサイトの場合、ドメインごとに異なるユーザーとして認識されてしまい、ページ間の移動も途切れてしまいます。リンク元のサイトを表すリファラーや、Googleで検索したキーワードと、購入回数が結び付かなくなります。

この問題を解決するため、Cookieの値をURLに付けて受け渡す方法（クロスドメイントラッキング）が用意されています。が、ドメインが切り替わるリンク全てを手で書き換える必要があります。

Googleが案内している標準的なクロスドメインリンクの記述方法

ところが、ドメインが切り替わるリンクを全て探し出してHTMLを編集するのは面倒なだけでなく、対応漏れが発生しがちです。特に今回は自分のサイトではないので、将来ずっと徹底できるとは限りません。

jQueryならonclickの記述が不要

そこで、リンクを自動で検出して自動でJavaScript関数を実行することにしました。jQueryというライブラリを使うと簡単です。

jQueryのフィルタ機能を使って、HTML中に書かれた全てのリンクを下記の条件で検索し、

• 現在閲覧中のドメインと異なるドメインへのリンクである
• 特定の指定したドメインへのリンクである

クリックされた時にGoogle Analyticsのクロスドメイン計測用の関数(_link)を自動実行する仕組みをセットしています（onclickのイベントをアタッチしている）。GAの設定とjQueryのJSファイル読み込みは別途必要です。

実際のJavaScriptファイルはこちら。（後からjQueryを使うことにしたので、同じファイルの前半にjQueryの長いコードが入ってます。ファイル末を見てください）

同じように、外部リンクのクリックをカスタムイベントで計測することもできますが、コンセプトダイアグラムを作った結果、このサイトでは重要ではないことが分かったので、実装しません。

11/13、所要時間は2時間でした。

続く：カラーミーのショップへGoogle Analyticsを導入