リダイレクトアフィリエイトリンクのリファラを取得する方法

※作成中ですが一時的に公開しています。

今回は、アフィリエイトリンクの中でもリダイレクトを行っているケースのリファラー取得方法について解説していきたいと思います。

具体的には、

301リダイレクト
meta refresh（メタリフレッシュ）によるリダイレクト
JavaScriptによるリダイレクト

を経由して、リファラーを取得する方法について解説します。

※技術的には、非エンジニアにとっては非常に難しい内容になっているので、社内にエンジニアの方がいる場合はエンジニアの方と一緒に見ていただくのがいいのかなというふうに思います。

前提：コンバージョンのリファラーについて

リファラーはアフィリエイトのコンバージョンが発生した時に、どのページから申し込みがあったかがわかるURLのデータになっています。

このデータがあると、どの記事からいくら売上が出ていたのかというのを計測することができるので、データ分析する際には必須になっていきます。

アフィリエイトリンクのリダイレクトURL

いろいろな事情によって、アフィリエイトリンクをそのまま使うのではなく、自前で準備したリダイレクトURLを計測して、リダイレクトリンク経由でアフィリエイトを計測しているケースがあります。

大きく分けると、

GA上でアフィリエイトリンクごとのクリックイベントを、わかりやすい命名形式で追いたい
SEO的にアフィリエイトリンクだと解釈されないようにしたい

などが多いようです。

リダイレクトの種類とその処理

その際にアフィリエイトリンクをリダイレクトさせる方法がいくつかあります。一般的にアフィリエイトリンクを使ってリダイレクトをかませる場合、以下の3種類が有名です。

301リダイレクト
メタリフレッシュリダイレクト
JavaScriptリダイレクト

それぞれ解説していきますね。

301リダイレクト

301リダイレクトは、ある記事へのアフィリエイトリンクが存在すると、そのまま指定したリンクへ転送（リダイレクト）してくれます。

メタリフレッシュ

一方でメタリフレッシュを利用してリダイレクトをする場合、記事のHTMLを読み込んだ後に、メタリフレッシュのタグを利用して、リダイレクトする方法になります。

Mozilaによるドキュメントの例を参考に、アフィリエイトリンクをメタリフレッシュでリダイレクトするコードを実装する場合、以下のようになります。

3秒後に
A8のリンクにリダイレクトする

<!-- 3 秒後にページをリダイレクト -->
<meta http-equiv="refresh" content="3;url=https://www.px.a8.net/?code=123" />

アフィリエイトの場合、アフィリエイトリンクのクリック数を計測するために、計測用のページ（ブリッジページ）を作成して、こちらでイベントを計測するケースが多いです。

例えば、

アフィリエイト記事: https://example.com/page/1
ブリッジページ : https://example.com/cv/tensyoku
広告主ページ: https://tensyoku.jp/lp

がある際、ブリッジページでメタリフレッシュが実行されます。

JavaScriptリダイレクト

JavaScriptリダイレクトは、メタリフレッシュと同様に、HTMLタグを通してJavaScriptを実行し、リダイレクトを行う方法になります。

以下のようなコードをHTML上に追加することで、リダイレクトを行うことができます。

<script>window.location.href = "https://a8.net/?code=123"</script>

301リダイレクトとメタリフレッシュ/JavaScriptリダイレクトの違い

301リダイレクトとの違いですが、

301リダイレクト：HTMLを読み込まない
メタリフレッシュリダイレクト：HTMLを読み込む

という大きな違いがあります。

メタリフレッシュの場合、HTMLを読み込むことができるので、リダイレクト前に、コンバージョンのイベントをHTML経由で仕込んだりすることも可能になります。

301リダイレクトのリファラの取得方法

301リダイレクトの場合は基本的にやることは一つで、メタタグを指定してあげれば基本的にリファラが取れるようになります。基本的にはこのタグひとつをグローバルヘッダーに入れてあげればOKです。

<meta name="referrer" content="no-referrer-when-downgrade"/>

このタグの詳細についてはコンバージョンのリファラーが取得できない時に確認する3つのことでも解説していますが、異なるドメインに対してリンクを貼った時に、その元のページにリンクを渡すような設定をしているようなタグになります。こちらを入れてあげると301リダイレクトの場合はリファラを取得することができます。

メタリフレッシュを利用したリダイレクトの場合

メタリフレッシュを使っている場合、ただ純粋にメタタグを入れただけだとリファラは取得できません。

アフィリエイトの記事があってブリッジページがあってアフィリエイトのリンクがあるので、アフィリエイトのリンクにアクセスした時に最後のリファラがブリッジページになってしまう可能性があります。下のリストを見てください。

アフィリエイト記事: https://example.com/page/1
ブリッジページ : https://example.com/cv/tensyoku
広告主ページ: https://tensyoku.jp/lp

③広告主ページからすると、HTMLでのリファラ情報はブリッジページになってしまいます。

JavaScriptリダイレクトの場合

JavaScriptリダイレクトの場合は、メタリフレッシュと同様になります。

メタリフレッシュと同様に、下のリストを見てください。

アフィリエイト記事: https://example.com/page/1
ブリッジページ : https://example.com/cv/tensyoku
広告主ページ: https://tensyoku.jp/lp

③広告主ページからすると、HTMLでのリファラ情報はブリッジページになってしまいます。

メタリフレッシュリダイレクトと、JavaScriptリダイレクトの際のリファラ取得はどうしたらよいか

メタリフレッシュリダイレクトと、JavaScriptリダイレクトの場合、ラストリファラーが取得できないケースが多いです。それではどうしたらよいでしょう。

結論、

ブリッジページで, アフィリエイトページのリファラを取得する
アフィリエイトリンクに、URLパラメーターにリファラを入れる

という方法を使うことになります。

どういうこと？と思われる方も多いと思うので、ぜひこの次をじっくり読み進めてください。

HTTPヘッダー経由のリファラ取得と、URLパラメーター経由でのリファラ取得

リファラ取得には、大きく分けると、

HTTPヘッダー経由でのリファラ取得
URLパラメーター経由でのリファラ取得

の二つがあります。

HTTPヘッダー経由でのリファラ取得

HTTP経由でのリファラ取得では、基本的にHTTPのリクエストヘッダーの値からリファラを取得します。難しく聞こえますが、アフィリエイトで普通にリファラを取得しようとすると、この仕組みで取得されます。

URLパラメーター経由でのリファラ取得

URLパラメーター経由でのリファラ取得は、アフィリエイトのURLに対して、リファラの値をURLパラメーターを通して計測する方法になります。

こちらに関しては、対応できるASPさんと対応できないASPさんがあります。

公式で対応しているというふうに書いているところで言うと、

もしもアフィリエイトさん: 上級者任意パラメーター
afbさん: リンクコードと成果を結びつける

パラメータ経由でのリファラ取得に対応しているという状況になっています。

ちょっとわかりづらいと思うのですが、もしもアフィリエイトさんこんな感じです。

http://c.af.moshimo.com/af/c/click?a_id=506537&p_id=54&pc_id=54&pl_id=621&s_v=xxxxxx

s_v=xxxxxx の箇所に、任意の値を入れることで、コンバージョンをエクスポートした際にCSVの列名から、取得することができます。

このxxxxに対して、リファラーを入れられるように、タグマネージャーで設定していきます。完成系のイメージはこんな感じです。

http://c.af.moshimo.com/af/c/click?a_id=506537&p_id=54&pc_id=54&pl_id=621&s_v=https://example.com/page/1

ちなみにこのタイプでのリファラ取得を行いたい場合、一部開発が必要になります。

メタリフレッシュを利用する場合は、URLパラメーター経由でリファラを取得する

ブリッジページを経由する場合、繰り返しますが、ブリッジページのリファラが取得されてしまいます。そこで、

ブリッジページ内で遷移元のアフィリエイト記事のリファラをHTTPヘッダーからjavascriptで取得
取得したURLを、meta refreshで指定するリダイレクト先アフィリエイトリンクのURLパラメーターに入れる

という方法になります。

実装のイメージとしては、以下のような形になります。(なお下のコードはあくまで参考で、実際に動くわけではありません。）

<!-- 3 秒後にページをリダイレクト -->
<meta http-equiv="refresh" content="3;url=https://www.px.a8.net/?code=123" />

// ここで、meta refreshのURLを動的に書き換える 
<script>
const referer = document.referer
if referer {
   const metaTags = document.getElementsByTagName('meta');
   const metaRefreshTag = metaTags.find((tag) => tag.getAttribute('http-equiv') === 'refresh');
   //リファラーでmeta refreshのURLを置換する
}
<script>

もちろんそれぞれのブリッジページごとに実装していくのでもよいのですが、Googleタグマネージャーからjavascriptを実行できるようにして、タグマネージャー経由でリファラ情報をリダイレクト先に入れてあげるとよりよいでしょう。

リダイレクトの種類の判定法

自社のアフィリエイトリンクが、

301リダイレクト
メタリフレッシュによるリダイレクト
JavaScriptによるリダイレクト

のうち、どれを使うかわからない、という場合。

弊社で提供している、リダイレクトチェッカーというツールを利用すると、リダイレクトされている記事が301, メタリフレッシュ, JavaScriptリダイレクトなのか判定することができます。

リダイレクトされるアフィリエイトリンクを入れると、リダイレクトチェッカーが自動でリダイレクトログを取得してくれるので、ぜひ使ってみてください。

リダイレクトの種類によるリファラ取得の検証

ここからはエンジニアの方向けの解説になります。

301リダイレクトとメタリフレッシュでリファラ情報が取れるか取れないかの検証を一緒にしていきたいと思います。

前提、no-referer-when-downgradeのメタタグが指定されているとします。

この場合で、

301リダイレクトのリンク
メタリフレッシュのリンク

のケースで、リファラが取得可能か見てみましょう。

301リダイレクトリンク：リファラが取得できる

301リダイレクトで、特定のアフィリエイトリンクに対して、リダイレクトを指定します。WordPressのプラグインだと、Redirectionがあるので、それを利用します。

次に、リダイレクトで指定したURLへアクセスします。そうするとアフィリエイトのリンクのページに届くので、その後に右クリックから開発者ツールを開いてください。

consoleから、以下のコードを実行します。

document.referrer

とやると最後のページですね、リダイレクト前のページにのリファラ情報が取得できます。この値を使ってアフィリエイトではコンマージョンのリファラを取得しています。

メタリフレッシュ：リファラが取得できない

メタリフレッシュ経由でリファラ情報を取得しているような会社を想定してやっていきたいと思います。まずですね、ワードプレスとかだったら適当にページを作ってもらって、そこにですね、HTMLタグで以下のようなコードを入れてもらいます。


<meta http-equiv="refresh" content="3;url=https://www.px.a8.net/?code=123" />

そうするとですね、メタリフレッシュが動くはずなので、一旦そのページを公開して開いてみましょう。これでメタメタリフレッシュされてますね。じゃあ適当にですね、別の記事からメタリフレッシュのページにアクセスしてリダイレクトしてみましょうか。

アフィリエイトのページに届くと、広告主のページにつくと思うんですけど、これをですね、document.referer してみるとリファラが見えないはずです。

リファラを取得できるようにするには？

メタリフレッシュを使っている場合は、URLパラメーター経由でリファラを取得できるようにするか、メタリフレッシュを使わないようにする
リダイレクトを使うか使わないか関係なく、no-referer-when-downgradeタグを追加する

が必要になります。

なお詳しいやり方について技術的なご相談は、河合大までDMください。