jsonpの原理と実現

JSONPとは
javascript高級プログラム設計においては、jsonpをこのように紹介しています.
JSONはJSON With padding(充填式JSONまたはパラメータ式JSON)の簡略化であり、JSONを適用する新しい方法であり、その後のWebサービスに非常に流れる.jsonはJsonとほぼ同じように見えますが、関数コールに含まれるjsonだけです.jsopはコールバック関数とデータの二つの部分から構成されています.
簡単に言えば、jsonpはドメインをまたいで通信する手段で、その原理は実はとても簡単です.

は、まず、scriptタグのsrc属性を利用してクロスドメインを実現する.

は、フロントエンド方法をパラメータとしてサービスに伝達し、その後、サービスによるパラメータ注入後に戻って、サーバからクライアントへの通信を実現する.

は、scriptタグのsrc属性を使用しているので、get方法のみをサポートしています.

以下の詳細に説明します.
一.実現プロセス
1.scriptタグを設定する

2.calbackは を していますが、リモート・サービス は された およびパラメータパラメータを び して パラメータを し、fnをクライアントに します.

$callback = !empty($_GET['callback']) ? $_GET['callback'] : 'callback';
echo $callback.'(.json_encode($data).)';

 
3.クライアントが したjsスクリプトを し、 を し、fnを する.
 
.jsonp
 
1.ブラウザ :
まずグローバルにcalbackコールコールバック を して、この の を えてください.この はパラメータを け ります.パラメータはサービスから ります. の な はこのデータを します.
に、scriptタグを に し、srcは、リソースを するアドレス＋ のフィールド ＋コールバック であり、ここで フィールド を するには、サービス との があり、サービス がコールバック を するためである.( えば、www.example.com?calbackName=reult)
 

function result (data) {
  console.log(data.name)
}
var jsonp = document.createElement('script')
jsonp.src = 'www.example.com?callbackName=result'
document.getElementsByTagName('head')[0].appendChild(jsonp)

 
2.
ブラウザ scriptの を けた 、urlのqueryのcalbackNameからコールバック の を しました. としては、resultです.
この を するために、jsセグメントを に します.たとえば:
 

result({name:'Joy'})

 
3.
 
サービスがこのscriptに ったら、ブラウザがscriptリソースを して、すぐにこのjsを します.つまり のセグメントは に いたコールバック によってこれらのデータを できます.
 
いくつかのサードパーティライブラリでは、しばしばjqueryの$getJSONなどのjsopの をカプセル します.