楽天のアフィリエイトリンクを改変しないでクリックログを取る方法

2008年 3月 28日 14:21

アフィリエイトリンクを掲載した場合に、どのアフィリエイトリンクが、よくクリックされているかのログが取れると、いろいろと便利だったりします。

まぁ、楽天ウェブサービスなんかを使えば簡単に実現できるのですが、今回は通常のアフィリエイトリンクのクリックログを取る方法を説明したいと思います。

通常の楽天アフィリエイトリンクの場合、楽天のシステム側で生成されたHTMLのソースコードを改変(変更)せずに使わなければならないので、いろいろ面倒なのですが、javascript を使って DOM 構造を直接弄ればなんとか実現できます。

とりあえず、サンプルのファイルを3つ作りましたので、1つづつ説明します。

test.html

<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Click log Example</title>
    <script type="text/javascript" src="/click.js"></script>
</head>
<body onload="setOnClick()">
    <a href="http://pt.afl.rakuten.co.jp/c/99999999.99999999/?url=http%3a%2f%2fwww.rakuten.co.jp%2f">商品1</a><br />
    <a href="http://pt.afl.rakuten.co.jp/c/99999999.99999999/?url=http%3a%2f%2fbooks.rakuten.co.jp%2fRBOOKS%2findex.html">商品2</a><br />
    <a href="http://pt.afl.rakuten.co.jp/c/99999999.99999999/?url=http%3a%2f%2ftravel.rakuten.co.jp%2f">商品3</a><br />
</body>
</html>

まず、test.html ですが、これはアフィリエイトリンクの掲載されているHTMLページのサンプルになります。HTMLのソースを見ると分かるように、アフィリエイトリンク自体は特に改変せずに、通常の a タグで作っています。(ちなみに、アフィリエイトキーはダミーです。)

ポイントは読み込んでいる javascript ファイル click.js と body タグの onload で指定している javascript の関数で、このスクリプトの中で、アフィリエイトリンクの DOM 構造を操作しています。

どんなページであっても、このサンプルの test.html のように click.js を読み込んで body タグに onload=”setOnClick()” を記述するだけで、そのページの楽天アフィリエイトのクリックログが取れるようになります。ただし、iframe 等を用いて、別のフレームで表示されているアフィリエイトリンクの場合はその限りではありません。

test.html で読み込んでいる javascript ファイルは click.js というファイルで次のような感じになっています。

click.js

//リンクに関数を追加
function setOnClick() {
    var links = document.links;
    for (var i = 0; i < links.length; i++) {
        var link = links[i].href;
        if(link.indexOf("afl.rakuten.co.jp") > -1) {
            links[i].onclick = clickLog;
        }
    }
}

//ログ記録Ajax
function clickLog() {
    var link = this.href;
    try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {
            xmlhttp = false;
        }
    }
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
        xmlhttp = new XMLHttpRequest();
    }

    if (xmlhttp) {
        xmlhttp.onreadystatechange = function() {}
        xmlhttp.open('GET', '/click.php?link=' + encodeURIComponent(link));
        xmlhttp.send(null);
    }
}

setOnClick 関数で HTML の DOM 構造からリンク部分を抽出し afl.rakuten.co.jp の文字列の含まれるリンク全てに onclick のイベントを追加しています。これにより、アフィリエイトリンクのソース自体を改変しなくても、onclick のイベントを取得することができ、どのアフィリエイトリンクがクリックされたかの情報を取得することができるようになります。

onclick のイベントは clickLog 関数でハンドリングするようにしていますので、この中で、いわゆる Ajax を使うことにより、サーバ側の php を呼び出しクリックログを出力しています。

実際のログを記録する php は次のような感じで作ってみました。

click.php

<?php
//ログ記録ファイル
define("LOG_FILE", "/var/log/apache2/affiliate_log.txt");

//キャッシュさせないためのヘッダー出力
header("Expires: Thu, 01 Dec 1994 16:00:00 GMT");
header("Last-Modified: ". gmdate("D, d M Y H:i:s"). " GMT");
header("Cache-Control: no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");

//アクセス情報取得
$url = $_SERVER["HTTP_REFERER"];
$link = $_REQUEST["link"];
$remote_addr = $_SERVER["REMOTE_ADDR"];
$user_agent = $_SERVER["HTTP_USER_AGENT"];

//ログ出力
$date = date("Y-m-d H:i:s");
$fp = fopen(LOG_FILE, "a");
fwrite($fp, "{$date} {$url} {$link} {$remote_addr} {$user_agent}\n");
fclose($fp);
?>

このサンプルでは単純なログしか取っていませんので、実際に使う場合には、ダイレクトにアクセスされた場合の処理や、その他もろもろの処理を加えてあげればいいと思います。

ちなみに、自分が使ってるバージョンでは、ファイルにログを記録せずに、DB に入れていたりします。

また、サンプルは楽天でしたが、単純に全てのリンクのクリックログを取得したり、Google analytics と連携して、クリックログを記録したりもできると思いますので、暇な方はやってみてください。


トラックバック URL


※言及リンクのないトラックバックは削除されます。
※書き込まれてから公開されるまで時間がかかる場合があります。

コメントをどうぞ

Spam protection by WP Captcha-Free

※書き込まれてから公開されるまで時間がかかる場合があります。