Measurement Protocolで始めるメルマガ解析

#Measurement Protocolとは
「Measurement Protocol」はユニバーサルアナリティクスより追加された新機能で、画像ビーコンにより直接情報が送信できる仕組みです。画像がリクエストされるとアナリティクスが発動するので下記のようなトラッキングが可能です。

- メルマガの開封率やリンクのクリック数を調べる
- ガラケーでのアクセス解析を行う
- JavaScriptがOFFのユーザー数を調べる

今回は「Measurement Protocol」を用いてメルマガの解析を行います。

##どうやるか？
イベントトラッキングを使ってメルマガが開封された数やクリックされたリンクとその数を集計します。メルマガが開封されたかどうかは、画像が読み込まれたことで判断できそうです。
また、リンククリックの数はクリック時にPHPに一旦飛ばしイベントトラッキング発動、その後飛ばしたいURLへリダイレクトで取得できそうです。

##設置方法
下記PHPの「トラッキングID」を自身のサイトのものに修正し、サーバにUPします。
仮に```[YourDomain/mail/]```にUPされたものとします。

````php:index.php
<?php
// 必須の値「イベント カテゴリ」「イベント アクション」が共に存在し空で無い時のみ発動
if(isset($_GET['ec']) && is_string($_GET['ec']) && isset($_GET['ea']) && is_string($_GET['ea'])) {

	$cid = "";

	// クライアントIDのCookieがある場合利用
	// Desktop GmailはCookieが効く？Android Gmail及びOutLook 2007は効かず。。
	if(isset($_COOKIE["measurementprotocol"]) && strlen($_COOKIE["measurementprotocol"]) == 36) $cid = $_COOKIE["measurementprotocol"];

	// 無い場合生成
	else $cid = sprintf('%04x%04x-%04x-%04x-%04x-%04x%04x%04x', mt_rand(0, 0xffff), mt_rand(0, 0xffff), mt_rand(0, 0xffff), mt_rand(0, 0x0fff) | 0x4000, mt_rand(0, 0x3fff) | 0x8000, mt_rand(0, 0xffff), mt_rand(0, 0xffff), mt_rand(0, 0xffff));

	// プロトコルのバージョン（必須）
	$param = "?v=1";

	// トラッキングID（必須）
	$param .= "&tid=UA-XXXXXXXX-X";

	// クライアントID（必須）
	$param .= "&cid=".$cid;

	// IP オーバーライド（任意）
	$param .= "&uip=".$_SERVER['REMOTE_ADDR'];

	// ユーザー エージェント オーバーライド（任意）
	$param .= "&ua=".rawurlencode($_SERVER['HTTP_USER_AGENT']);

	// 画面の解像度（任意）
	$param .= isset($_GET['sr']) && is_string($_GET['sr']) ? "&sr=".$_GET['sr'] : '';

	// 表示領域のサイズ（任意）
	$param .= isset($_GET['vp']) && is_string($_GET['vp']) ? "&vp=".$_GET['vp'] : '';

	// ドキュメントのエンコード（任意）
	$param .= "&de=UTF-8";

	// 画面の色（任意）
	$param .= isset($_GET['sd']) && is_string($_GET['sd']) ? "&sd=".$_GET['sd']."-bit" : '';

	// ユーザーの言語（任意）
	$param .= "&ul=ja";

	// ヒットタイプ（必須）
	$param .= "&t=event";

	// 非インタラクション ヒット（任意）
	$param .= "&ni=1";

	// イベント カテゴリ（必須）
	$param .= isset($_GET['ec']) && is_string($_GET['ec']) ? "&ec=".$_GET['ec'] : '';

	// イベント アクション（必須）
	$param .= isset($_GET['ea']) && is_string($_GET['ea']) ? "&ea=".$_GET['ea'] : '';

	// イベントラベル（任意）
	$param .= isset($_GET['el']) && is_string($_GET['el']) ? "&el=".$_GET['el'] : '';

	// キャッシュの無効化（任意）
	$param .= "&z=".mt_rand(100000000000, 199999999999);

	// Measurement Protocol叩く
	file_get_contents("https://ssl.google-analytics.com/collect".$param);

	// Cookieの保存（アナリティクス同様、とりあえず2年とする）
	setcookie("measurementprotocol", $cid, time() + (3600 * 24 * 365 * 2));

	if (isset($_GET['url']) && is_string($_GET['url'])) {
		// リダイレクト
		header("Location:".$_GET['url']);
	} else {
		// 画像ヘッダ出力
		header("Content-type: image/gif");
		// 1px×1pxの透過GIF画像を表示
		echo base64_decode("R0lGODlhAQABAID/AP///wAAACwAAAAAAQABAAACAkQBADs=");
	}

}
?>
```

次にメルマガ内のHTML例です。

````html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>メルマガTEST</title>
</head>
<body>
<!--リンククリック計測-->
<p><a href="[YourDomain]/mail/?ec=HTML%E3%83%A1%E3%83%BC%E3%83%AB%E8%A7%A3%E6%9E%90&ea=%E3%83%A1%E3%83%AB%E3%83%9E%E3%82%AC2015%E5%B9%B410%E6%9C%88%E5%8F%B7&el=%E3%83%AA%E3%83%B3%E3%82%AF1&url=https%3a%2f%2fwww%2egoogle%2eco%2ejp%2f">リンク1</a></p>

<p><a href="[YourDomain]/mail/?ec=HTML%E3%83%A1%E3%83%BC%E3%83%AB%E8%A7%A3%E6%9E%90&ea=%E3%83%A1%E3%83%AB%E3%83%9E%E3%82%AC2015%E5%B9%B410%E6%9C%88%E5%8F%B7&el=%E3%83%AA%E3%83%B3%E3%82%AF1&url=https%3a%2f%2fwww%2egoogle%2eco%2ejp%2f">リンク2</a></p>

<p><a href="[YourDomain]/mail/?ec=HTML%E3%83%A1%E3%83%BC%E3%83%AB%E8%A7%A3%E6%9E%90&ea=%E3%83%A1%E3%83%AB%E3%83%9E%E3%82%AC2015%E5%B9%B410%E6%9C%88%E5%8F%B7&el=%E3%83%AA%E3%83%B3%E3%82%AF1&url=https%3a%2f%2fwww%2egoogle%2eco%2ejp%2f">リンク3</a></p>

<!--メルマガ開封-->
<img src="[YourDomain]/mail/?ec=HTML%E3%83%A1%E3%83%BC%E3%83%AB%E8%A7%A3%E6%9E%90&ea=%E3%83%A1%E3%83%AB%E3%83%9E%E3%82%AC2015%E5%B9%B410%E6%9C%88%E5%8F%B7&el=%e3%83%a1%e3%83%bc%e3%83%ab%e9%96%8b%e5%b0%81">
</body>
</html>
````
|パラメータ|名称|必須 or 任意|用途|
|:-----------:|:------------:|:------------:|:------------:|
|ec|イベント カテゴリ|必須|アナリティクスでイベント カテゴリの値を設定する|
|ea|イベント アクション|必須|アナリティクスでイベント アクションの値を設定する|
|el|イベントラベル|任意|アナリティクスでイベントラベルの値を設定する|
|url|リダイレクト先URL|任意|リンククリック時にリダイレクトする。無い場合画像ビーコンを出力|

※ 「イベント カテゴリ」「イベント アクション」は**必須**なので、パラメータがある場合にのみ計測されるようしています。
※ 「イベント カテゴリ」「イベント アクション」「イベントカテゴリ」は日本語OKですが、UTF-8にてURLエンコードしたものを付加して下さい。
※リンククリック計測時は&lt;a&gt;タグのhref属性に【url】パラメータを付加して下さい。こちらもUTF-8にてURLエンコードした値が必要です。
※ メルマガ開封を測るには、ページ下部に&lt;img&gt;要素のsrc属性に指定します。この際は【url】パラメータは不要です。

##結果
アナリティクスで下記のように取れました。
![名称未設定-1.png](https://qiita-image-store.s3.amazonaws.com/0/95865/a0c9548a-09c1-d123-568d-b2b1643499b2.png)

なお、「Measurement Protocol」のパラメータについては公式ページにて詳しく説明されています。

[Measurement Protocol のパラメータ リファレンス | アナリティクス Measurement Protocol | Google Developers]
(https://developers.google.com/analytics/devguides/collection/protocol/v1/parameters?hl=ja)