Amazon Web ServiceとRightFields Pluginを連携させてみた(2)
Amazon Web ServiceのECS 3.0と、MovableTypeのRightFileds Pluginを使って、各エントリーページの広告をメンテナンスフリーでうまいこと表示してしまおうという試み。前回はECS 3.0へ各エントリから任意の値を渡すべく、RightFields Pluginの設置まで行いました。今回はECS 3.0への値の渡し方や、XSLTについて、あんまり詳しくない解説をします。
いまさらですが、ECSはAmazon Web Serviceの一つで、一般ユーザへAmazon内の商品データを提供する技術です。これによりユーザは、自分のサイト内で好みの商品やコンテンツに最適な商品を紹介するすることが出来、もちろんデザインやレイアウトなどの体裁を自由にカスタマイズすることが可能になります。素材としてのデータが提供されるので、あとは使うユーザのアイデア次第ということですね。これにAmazonアソシエイト・プログラムというアフィリエイトを組み合わせることにより、ECSを使って売った商品の、紹介料を稼ぐこともできるというわけです。
ECSやアソシエイト・プログラムを利用するにはそれぞれユーザ登録が必要です。ECSに登録するとAccess Key IDが発行され、アソシエイト・プログラムへ登録するとアソシエイトIDが発行されます。
Access Key IDについては非常にややこしく、利用するECSのバージョンにより名称や値が変わってきている模様。僕が登録したECS 3.0時代はDeveloper Tokenと呼ばれていたのですが、4.0になって一旦Subscription IDという名称を経てAccess Key IDに落ち着いたようです。僕はECS 3.0のDeveloper Tokenと4.0のAccess Key IDを持っていてそれぞれ値が違うのですが、AmazonのFAQにあるように、どちらを使っても正常にデータを取得できます。
そしてさらに厄介なのがECSのバージョンによる仕様の差異です。データ取得に使うURLの記述法がまるっきり違っていたり、返されるXMLの構造・ノードの名称が異なるなど、バージョン・アップではなく「刷新」ではないかという印象を受けました。ほとんど別物じゃねえかと。ECS 4.0の方がデータを細かいレベルで必要なだけ抽出できたりと、便利そうではあるのですが、初めに手を付けてしまったのが3.0用のXSLTテンプレートであったことと、ググると3.0の情報の方が多かったため、僕は3.0の仕様でやってみることにしました。大規模なECサイトを構築するわけではないので、動けばどっちでもよいかなと。
さて、以上がちょこっと（!!）長い前置き。
ECSで提供されるデータへは、大きくRESTとSOAPと呼ばれる方法でアクセスが可能です。RESTとSOAPの違いについてはsmartのこちらの記事が参考になると思いますが、僕の場合SOAPは完全お手上げなのでRESTを使うことに。なんやかんやと難しく思われるかも知れませんが、とりあえずRESTでデータを取得するには、以下のフォーマットでデータ取得用のURLをつくってアクセスすればOKです。
?t=[アソシエイトID]
&dev-t=[Developer TokenまたはAccess Key ID]
&[search method]=[任意のキーワード]
&mode=[JP mode parameter]
&locale=jp
&type=[liteまたはheavy]
&f=[xmlまたはXSLTのURL]
青字部分のパラメータはかなり細かく用意されていますが、アプリコット・ジャムの「アフィリエイトを始めよう - アマゾン」に丁寧な解説がありますので、参考にぜひご覧下さい。
それでは具体的に、僕のアソシエイトIDとAccess Key IDを使って、「Mac」を「エレクトロニクス」から「キーワード検索」したときの取得データを見てみましょう。
するといかがでしょうか。別ウィンドウに溢れるほどにXMLデータが送られてきたはずです。各ノードの値を見れば分かるとおり、前述の条件での検索結果ということになりますが、しかしこれは単なる素材の状態に過ぎません。そしてこの素材を、誰の目にも見やすく整えるのがXSLTです。
先ほどから何回かこのXSLTという言葉を出していますが、何かというとXMLを(X)HTMLへ変換する技術で、いわばXMLのスタイルシートです。データの整形方法としてはXSLT以外にもJavaScriptによるDOMを使う手があると思いますが、たまたま僕の手元にECS 3.0のサンプル・テンプレートが残っていたので、それをカスタマイズして利用しています。
内容としては、検索結果3商品の [タイトル] [サムネイル画像] [制作者] [平均レート] [Amazon価格] [カートに入れるボタン] をXHTML化する単純なもので、ページに埋め込むことが前提のため<body>タグや<タグ>の吐き出しも行っていません。正直XSLTの知識なんて無いに等しく、精通した人が見れば穴だらけの代物かも知れませんが、多少でも参考になるのであれば幸いです。
後はこのXSLTをどのようにして取得データにあてるかということなのですが、これは非常に簡単です。前述のデータ取得用URLの最後のパラメータ、ピンク色の部分をXSLTのURLに置き換えればOK。.（ドット）以外の記号については予めUTF-8でURLエンコードしておきました。
上記をクリックすると、今度は見た目も中身（ソース）も見慣れたXHTMLの状態で出力されたはずです。
さてさて、なんとなく感じはつかんでいただけましたでしょうか!? XSLTはいわゆるスタイルシート（CSS）とは違って条件分岐等プログラム的な要素があり、勉強さえすれば本当に多種多様な使い道が開けそうです。デザイナーがどこまで首突っ込むべきかは難しいところですが、奥深い...。
これでECS 3.0を使った商品の検索結果表示ができたことになります。次回はいよいよRightFileds Pluginとの連携と、既存ページへの埋め込み方法についてエントリーしたいと思います！