jQueryでJSONPを扱うのに、ちょっとはまったのでメモ。
jQueryでJSONP形式のWeb APIを利用する場合は、$.ajaxか $.getJSONメソッドで処理を行う。URLパラメータに渡すcallback=? という記述がミソで、このときWeb API側がどのようなコールバックの名前を設定しようとも 自動的に function(data){ のところに返ってくる。
[sourcecode language=’php’]
$.getJSON( “http://example.com/service/?callback=?”,
null,
function(data){
// 処理
});
[/sourcecode]
さて、はまったのはWeb上に用意されているJSONP形式のファイルを扱う場合だ。データの更新頻度が少ない場合は、たまに更新される静的なJSONPファイルを扱うほうがだんぜん早い。
…ということでやってみると、ファイルの中にあらかじめコールバック(“mycallback”とする)の名前が埋め込まれているためか、上記のスクリプトではレスポンスがない。正しくは 「ない」のではなくて 別関数として function mycallback() を用意しておけば、そこに返ってくる。function(data){ へは返ってこない。当然といえば当然なのか。しかし、せっかくjQueryなんだからあくまでもスマートに記述したいのだ。いろいろやってみて以下のようなスクリプトに到達した。
[sourcecode language=’php’]
$.getJSON( “http://example.com/service/example.json?callback=?”,
null,
mycallback = function(data){
// 処理
});
[/sourcecode]
Webや書籍でこのような例が見つからない。あまりやらない方法なのかな?