色々制約がある楽天市場の商品ページ。通常だとJavaScriptも使えませんが、店舗用のサーバサービスである「楽天GOLD」を使うとJavaScriptが使えます。また「楽天GOLD」のページであれば、楽天市場のページにiframeを使って埋め込むことも可能です。
楽天GOLDでは基本的にhtmlしか使えないので、基本的にJavaScriptでの処理になります。それでやっても良いんですが、楽天GOLDは基本的にファイルサーバ的なサービスなので、処理系を作るのには向いてません。なので、プログラム処理する部分はサーバを借りてそこに置くしかありません。
で、結局流れとしては、
[自サーバ] プログラム処理して結果出力
↓
[楽天GOLD] Ajaxで出力を取得して表示
↓
[楽天市場] 楽天GOLDのページをiframe使って商品ページに埋め込む
という感じ。
注意点
自サーバの出力を取得するためには、自サーバ側でクロスドメインを許可しておく必要があります。詳しくはこの辺を参考に。続 クロスドメインで使う XMLHttpRequest と CORS の話 | 日頃の行い
PHPでやるんなら、出力時にヘッダを付加しておくのが便利です。
header('Access-Control-Allow-Origin: *');Ajax取得はjQueryで適当にやりました。以下、サンプルコード。
$(document).ready(function() {
$.ajax({
url : 'http://hogehoe/sample.php',
type : 'GET',
dataType : 'html',
crossDomain : true,
}).done(function(data, textStatus, jqXHR) {
$("#result").append(data);
});
});楽天市場は色々と使いづらいけど、やってみればいろいろやり方はあるんだなー
