Paypal

【Paypal】支払いボタンを応用して自作アフィリエイトリンクを作る

Paypal-アイキャッチ

こんにちは!ゆーたろうです。

みなさん、Paypalは使っていますか?

PayPayではないですよ。

海外の決済サービスなのですが、個人間決済を低手数料で実現してくれるとてもいいサービスの一つです。

今回は、Paypalを使っている中で、また一つ、知識が増えたので、備忘録を書いていきます。

結論:学んだこと

早速、今回学んだことですが、

  • on1・・・オプション名
  • os1・・・オプションの値

を設定することで、ボタン作成者が自分で独自の文字列を設定することができる!

ということが分かりました。

具体的に言えば、こんな感じです。

ペイパル-オプション設定

図のように、ボタン作成者が決めた文字列を設定することができるのです!!

オプションを設定することができるとアフィリエイトリンクも作れるようになる

さて、ここで疑問になるのが、「・・・でどう便利になるの?」だと思います。

そもそも、なぜ今回、この機能が欲しかったのかと言えば、アフィリエイトリンクを簡単に作りたかったからです。

今作成中のツールは、ゆくゆくはアフィリエイトプログラム化して、自分が売らなくても、代わりに、売るのが得意なパートナーと組んで、ツールを販売していこうと考えています。

そこで重要になるのが、アフィリエイトプログラムの考え方です。

アフィリエイターが貼ったリンクを踏んで商品を購入することで、その何割かをアフィリエイターにお礼として支払うのが、アフィリエイト広告なのですが、今回のPaypalボタンでも、応用すれば、このアフィリエイトリンクが自分で作れることになります。

アフィリエイトプログラムをするには、トラッキングをどうするかが重要

A8などのASPでアフィリエイトを実施したことがあればイメージがしやすいのですが、アフィリエイト広告は、アフィリエイターがいて、そこから買われたことが、運営側に通知され、そこで初めて報酬が発生します。

そのため、いかにトラッキングの精度を上げるかが重要なのです。

アフィリエイトプログラムの仕組みを調査

実際に自分がASP的なポジションになるので、今のアフィリエイトプログラムがどのような仕組みで、トラッキングされているかを調べてみることにしました。

検索ワードは「アフィリエイトリンク 仕組み」です。

※私はなるべく当時の自分がどのような思考プロセスで結論までたどりついたのかを残すことで、今後の成長につなげたいと思っています。

なので、こういった部分も残さず記録していくので、読みにくかったらすみません。

さて、本題に戻り、この検索ワードで調べたらこんな記事が見つかりました。

なんと、A8netの開発秘話の記事です。

読んだ後、とても感動しました。
まさか、imgタグでそんなことができるとは思いもしなかったので、目から鱗でしたね。

しかし、今回の制約はこんな感じでした。

  • Paypal決済を挟まなければならない
  • 拡張機能とサーバを連携させたアプリケーションである

この2点があるので、今回は、imgタグを使ったトラッキングは不採用としました。

というのも、現決済システムは、PayPayを経由したユーザ管理を行っているので、やはりそこと連携させたいのが本音です。

また、拡張機能の開発言語であるJavaScriptでは、クッキー情報などの操作がしづらいので実装が大変そう(=というかその辺の知識がないので、1から勉強する必要があり、今回の開発工数的にちょっと重そう)

あとは、クッキーに情報を入れて送受信する方法もいいかなと思ったのですが、ITPなるものの規制が強くなるようで、サイトをまたいだクッキーのトラッキングをブラウザ側が防止する改良があるようです。

ITP2.3でさらに規制が強化! アフィリエイト広告への影響について解説

これらのことから、クッキーやセッション、ユーザーエージェントなどを使ったトラッキングは将来長くないかなと感じ、別の方法を探すことにしました。

なるべくなら、改良や修正が極力少ないプログラミングや仕組み作りをしていきたいですからね。

そしてたどり着いたのが、Paypalのボタン編集画面

―です。

Paypalは、購入ボタンを作成する際に、様々なボタンのカスタマイズができることを思い出したのです。

ペイパルボタン作成画面

こんな感じで、いろいろカスタマイズできます。

そして、きっとここにボタン作成者が自分で文字を入れたりフラグを設定できたりが可能ではないかと思ったのです。

模索1:高度な変数に値を入れてみる

探してみたら、ステップ3に

「高度な変数説明を見るパワーユーザーは、ここで特別なPayPalボタン変数を追加することができます。パワーユーザーは、ここで特別なPayPalボタン変数を追加することができます。
各変数の間には改行を入れてください。変数はボタンのHTMLコード内に表示されます。もっと詳しく
高度な変数を追加する」

という、高度な変数を追加する項目があるではないですか!

きっとこれが何かヒントになると考え、調べてみました。

検索ワード「高度な変数説明を見るパワーユーザーは、ここで特別なPayPalボタン変数を追加することができます。パワーユーザーは、ここで特別なPayPalボタン変数を追加することができます。 各変数の間には改行を入れてください。変数はボタンのHTMLコード内に表示されます。もっと詳しく」

で調べたら、こんなサイトが見つかりました。

DRUPAL会員制サイトにPAYPAL継続課金を追加

ほぉほぉ、こんな感じで変数と値を設定すればいいか!

と思い、早速作ってみました。

具体的には、「高度な変数」欄にtest=AAAと入れたら、URLリンクの末尾に「&test=AAA」が付与されたリンクが発行されました。

ですが、IPNで飛んできたデータを見ても、どこにも「test」も「AAA」もありませんでした。。。残念。

※備考:その際、ステップ2で「Paypalにボタンを保存する」にチェックを入れると、test=AAAがつかないURLが発行されるので、もし付与ありが欲しいなら、そのチェックを外しておく必要があります。

模索2:テキストエリア付きのボタンを作ってみる

次に、下記図のようにテキストエリア付きのボタンを作れば、そのフォームの入力値がIPNで飛ばすことができるのでは?と考えました。

Paypal-テキストエリア付きのボタン

まずは、このサンプルをそのまま使い、ボタンを生成してみましたが、IPNは飛びませんでした。。。

しかし、きっと何かしらの転送方法があると、勘が働いたので、

検索ワード「input type=”text” name=”os0″ paypal」で調べてみることにしました。

そしたら、

Hide submit button for PayPal payment form if input field is not 40 characters

という技術記事が見つかりました。

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="BHQLX7V2W2GJQ">
<table>
<tr><td><input type="hidden" name="on0" value="Select package">Select package</td></tr><tr><td><select name="os0">
    <option value="Premium">Premium $5.49 USD</option>
    <option value="Platinum">Platinum $14.49 USD</option>
    <option value="Diamond">Diamond $9.49 USD</option>
</select> </td></tr>
<tr><td><input type="hidden" name="on1" value="Enter your 40 character UDiD">Enter your 40 character UDiD</td></tr><tr><td><input type="text" name="os1" id="field" maxlength="40" placeholder="Paste UDiD here"></td></tr>
</table>
<input type="hidden" name="currency_code" value="USD">
<input type="image" src="https://www.paypalobjects.com/en_AU/i/btn/btn_buynow_LG.gif" border="0" name="submit" id="paypalButton" alt="PayPal — The safer, easier way to pay online.">
<img alt="" border="0" src="https://www.paypalobjects.com/en_AU/i/scr/pixel.gif" width="1" height="1">
</form>

ここに書かれたソースをコピーして、生成済みの自分のボタンに組み込んだら、ついにうまくいきました!!!

それが、冒頭で添付した図のこちらです。

ペイパル-オプション設定

つまり、「on1」と「os1」を付与したインプットデータをPaypal決済システム側に送信してあげれば、その値がIPNとして受信できるようです。

<input type="hidden" name="on1" value="Enter your 40 character UDiD">Enter your 40 character UDiD

<input type="text" name="os1" id="field" maxlength="40" placeholder="Paste UDiD here">

ちなみに、IPNからPOSTされた値がこちらです。

まとめ

今回もたくさん調査しましたが、ついに、今回の制約下でアフィリエイトリンクのようなボタンを作ることができました。

一応、調査~解決策発見までは約2時間ほどでしょうか。
これまで蓄えた知識が、点と点で結んで来始めているのを実感してます。

あとはこのフォームに、アマゾンでいうアソシエイトIDのような固有IDを付与してPayPay側に送る。それをIPN経由でサーバ側で受け取れば、晴れて、トラッキングシステムの完成です!

もちろん、アフィリエイターによるセルフアフィリエイト防止策も考慮する必要など諸々の処置がたくさんありますが、それはすでに考案済みなので、問題ありません。

仕組みを作るのは、本当に大変ですが、こうやって一つひとつ積み重なっていくのは楽しいですね。

その他参考サイト

PayPay ボタンの仕様書みたいです。今回は数ページしか見ませんでしたが、せっかくなので、残しておきます。

ウェブペイメントプラス インテグレーションガイド