rms.jpg


色々制約がある楽天市場の商品ページ。通常だと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);
  });
});


楽天市場は色々と使いづらいけど、やってみればいろいろやり方はあるんだなー