JSONP はクロスオリジンデータ転送の問題をどのように解決しますか?

JSONP: 入門

はじめに

JSONP (または JSON with Padding) は、データ交換を容易にする JSON 拡張機能です。異なるオリジンを持つ Web サイト間で。これは、ブラウザーの Cross-Origin Resource Sharing (CORS) 制限を回避するために作成されました。

コンセプト

Web サイトが、オリジンの異なる別の Web サイトからリソースにアクセスしようとしたとき、ブラウザーはセキュリティの脆弱性を防ぐために CORS 制限を適用します。 JSONP は、CORS 制限の影響を受けないスクリプト タグを使用して、このメカニズムの抜け穴を悪用します。

JSONP の仕組み

JSONP を使用するには、クライアント Web サイトにコールバック関数を指定し、次のようにサーバー Web サイトにリクエストを送信するスクリプト:

http://www.example.net/sample.aspx?callback=mycallback

サーバーWeb サイトは、次のように指定されたコールバック関数でラップされた JSON データで応答します:

mycallback({ foo: 'bar' });

クライアント Web サイトは、スクリプトのロード時に実行されるコールバック関数を定義します:

mycallback = function(data){
  alert(data.foo);
};

クロスオリジン問題の解決

JSONP では、次の方法でクロスオリジン データ転送が可能になります。スクリプト タグを使用して CORS 制限を回避します。これにより、Web サイトは、異なるドメインでホストされている場合でも相互に通信できるようになります。

使用例

JSONP は、次のような CORS が利用できない状況で役立ちます。

• 外部 API からのデータの取得
• クロスサイトの有効化ウィジェットと埋め込み可能なコンテンツの通信

以上がJSONP はクロスオリジンデータ転送の問題をどのように解決しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。