ホームページ >ウェブフロントエンド >jsチュートリアル >JSONP は jQuery のクロスドメイン AJAX 問題をどのように解決できるでしょうか?
jQuery AJAX クロスドメインのジレンマ: JSONP で CORS をバイパスする
クロスオリジン リソース共有により、異なるドメイン間でのデータのやり取りに課題が生じる(CORS) の制限。 localhost の test.php やリモート サーバーの testserver.php など、あるドメインから別のドメインへの AJAX リクエストを実行しようとすると、ブラウザによってこれらの制限が適用され、「エラー」アラートが表示されます。
これを克服するにはこの問題を解決するには、JSONP (パディング付き JSON) が有効な回避策として浮上します。スクリプト要素の柔軟性を利用して、ドメイン間でデータを取得します。
jQuery の変更:
dataType パラメーターを「jsonp」に変更して、JSONP を利用するように test.php を変更します。
PHP の変更:
testserver.php を調整するjQuery によって提供されるコールバックを使用して JSONP 応答をエコーします。
実装:
jQuery (test.php):
$.ajax({ url: "testserver.php", dataType: 'jsonp', // Notice! JSONP <-- P (lowercase) success: function(json){ // do stuff with json (in this case an array) alert("Success"); }, error: function(){ alert("Error"); } });
PHP (testserver.php):
<?php $arr = array("element1", "element2", array("element31", "element32")); $arr['name'] = "response"; echo $_GET['callback'] . "(" . json_encode($arr) . ");"; ?>
$.getJSON() を使用した簡略化されたメソッド:
代わりに、$.getJSON() 短縮メソッドを使用します。 「callback=?」を追加しますGET パラメータとして URL に追加します。
$.getJSON("testserver.php", function(json){ // do stuff with json (in this case an array) alert("Success"); });
以上がJSONP は jQuery のクロスドメイン AJAX 問題をどのように解決できるでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。