|
データの受信にXML・JSONでなくてJSONPを利用するシーンとしては、主に 1.サーバ側でレスポンスを動的に生成している 2.ブラウザ側JavaScriptからドメインを超えたAPIを呼び出したい そんなときが多いと思いますが、1のようにサーバ上にCGIなどが動かさなくても、 静的ファイルでもJSONPは利用可能です。 ただ制限として、やはり静的ファイルでは Padding たるコールバック関数名も 固定になってしまうため、スクリプト側で作成した任意のシリアル番号などを 付加したコールバック呼び出しもできません。 callback(もともと JSONP (JSON with Padding)の自体から、JavaScriptコードそのままですが、 そんな静的JSONPの性質は、ますます通常のJavaScriptと変わらないですね。 コールバック関数名が固定になるので、複数の静的 JSONP ファイルを扱う場合には 例えば呼び出しキューを作成して、順番に処理させるなどの工夫が必要になります。 そこで、↑の静的 Padding 部分(コールバック関数名 callback の8文字)を 以下の冒頭6行のコードに書き換えると、 静的ファイルなのに任意のコールバック関数名が指定できるようになります! ( function (data) { JSON データ本体の記述方法は、もとの JSONP と変わりません。 これを、仮に JSONP-SE と呼びましょうか。(JSONP static emulation) この JSONP-SE の使い方は、通常の JSONP と変わりません。 body 要素内の script タグで呼び出すことができます。 <script type="text/javascript" src="test.js?callback=hello"></script>これで、関数 hello が呼び出されます。 <script type="text/javascript" src="test.js"></script>callback= の URL 引数を指定しない場合(デフォルト)は、関数 callback(固定)が呼び出されます。 または、DOM で script 要素を生成してもOKです。 var script = document.createElement( 'script' );ただし、document.lastChild のようにして、JSONP-SE を呼び出す script 要素は 必ずDOMツリーの末尾に付加する必要があります。 ※ この JSONP-SE のように、script 要素の src 属性を見て URL 引数を取得する手法は、 以前から script.aculo.us でも使われていました。 |
| << 前記事(2008/01/17) | トップへ | 後記事(2008/01/28)>> |
| タイトル (本文) | ブログ名/日時 |
|---|---|
[JavaScript]JSONP-SEについて気になったこと
川崎有亮さんの静的JSONPファイルなのにコールバック関数名を指定できるJavaScriptのエントリに、 凄いけどレスポンスが帰ってくるタイミングしだいではうまく行かないような こんなはてブコメをつけたんですが、時間がたったら自信がなくなってきたので検証してみました。 ...続きを見る |
文殊堂 2008/01/28 19:31 |
| 内 容 | ニックネーム/日時 |
|---|
| << 前記事(2008/01/17) | トップへ | 後記事(2008/01/28)>> |