ホームページ > 記事 > ウェブフロントエンド > $.ajax または $.getJSON を使用して JSON データのクロスドメイン取得を実現するための jQuery のコードについて

$.ajax または $.getJSON を使用して JSON データのクロスドメイン取得を実現するための jQuery のコードについて

小云云オリジナル: 2018-02-02 13:39:271690ブラウズ

JSON データは JQuery を通じてドメイン間で取得できますが、JQuery によるクロスドメイン読み取り用の特定の JSON データはサーバー経由で出力する必要があるため、JQuery はどのような JSON 形式でもデータを取得できないことを理解する必要があります。まだよく分からないかもしれませんが、この記事ではこのテクノロジーを最も簡単に理解し、実際に応用できると思います。

この記事では、$.ajax または $.getJSON を使用して JSON データをドメイン間で取得するための JQuery の実装コードを主に紹介します。必要な方は参考にしていただければ幸いです。

JQuery は同じドメインから JSON データを取得します

まず jQuery ライブラリファイルを引用します:

e4fa1d4d1bcb7027db051d941ffe4ac12cacc6d41bbb37262a98f745aa00fbf0

jQuery コード:

var url="http://localhost:8000/user.php";
$(function(){
 $.getJSON(url,function(data){
 alert (data.name);
})
});

サーバーコード (PHP):

<?php 
header(&#39;Content-Type:text/html;Charset=utf-8&#39;); 
$arr = array( 
 "name" => "xiaoming", 
 "pass" => "123456"
); 
echo json_encode($arr); 
?>

サーバー戻り文字列:

{"name":"xiaoming"," pass ":123456}

JQuery を実行してクロスドメイン JSON データを取得します

まず jQuery ライブラリファイルを引用します:

575b0380e2df46168653a38ce049bce7

jQuery19003894091040769696_1505708469340({"name":"xiaoming","pass":123456})

説明、jQuery によって渡される値は毎回異なります。

同一ドメイン内のJSONデータを取得するJQueryとクロスドメインの違い追加パラメータ「jsoncallback=?」を追加する必要があります

2) ドメインを越える場合はサーバーから返される文字列の書き方が異なります。、「'jsoncallback'」の受信値を使用する必要があります。構築された文字列形式は次のとおりです: jsoncallback 受信値 (元の JSON 文字列)。必ず元の JSON 文字列を括弧で囲んでください。

概要

この記事の導入を通じて、jQuery でドメイン間で JSON データを読み取るには、まずサーバー側で特別な JSON 文字列を構築する必要があることを誰もが理解できるはずです。そうしないと幸いなことに、文字列は読み取られません。施工方法は非常にシンプルで、本文中の例を見れば一目で理解できます。

jQuery + Ajax によるクロスドメイン JSON データの取得

前の例では、$.getJSON を使用してクロスドメイン JSON データを取得しました。実際には、$.ajax メソッドを使用することもできます。最初に jQuery ライブラリファイルを引用します:

d182920226eca7d954e1ec536e9710db2cacc6d41bbb37262a98f745aa00fbf0

jQuery コード:

var url="http://localhost:8000/user.php?jsoncallback=?";
$(function(){
 $.getJSON(url,function(data){
 alert (data.name);
})
});

dataType が json ではなく jsonp であることに注意してください。

$.ajax または $.getJSON を使用して JSON データのクロスドメイン取得を実現するための jQuery のコードについて

関連記事