jQuery+JSONP クロスドメインリクエストを使用する手順の詳細な説明

今回は、jQuery+ JSONPクロスドメインリクエスト を使用する手順と、jQuery+JSONPクロスドメインリクエストを使用する際の 注意事項 について詳しく説明します。以下は実際のケースです。見てください。

JSONP(JSON Padding) は、主流ブラウザによるクロスドメイン データ アクセスの問題を解決するために使用できる JSON の「使用パターン」です。同一生成元ポリシーにより、通常は次の場所にあります。 server1.example.com の Web ページは、server1.example.com 以外のサーバーと通信できず、HTML 要素は例外です。 要素のこのオープン ポリシーを使用すると、Web ページは他のソースから動的に生成されたスクリプトを取得できます。 JSON データ。この使用パターンは JSONP と呼ばれます。 JSONPを使用してキャプチャされたデータはJSONではなく、任意の JavaScript を使用します JSON パーサーで解析する代わりに、JavaScript インタープリターが実行されます。

上の段落は百度百科事典から引用したものです。概念は常に非常に抽象的であり、最も直感的な表現は例を見ることです。たくさんの例を見て、その点を理解すると、自然に抽象的に説明できるようになります。 「知識の習得は、薄いものから厚いものへ、厚いものから薄いものへのプロセスである」と言われるのはこのためです。さて、行き過ぎましょう。例を直接見てみましょう。

問題: http://localhost:3561/User/GetAllNames からデータを取得して表示する必要があるローカル ページのデモ.html があります。

①クライアントライティング

クライアントは、クロスドメイン アクセスのために jQuery で提供される $.getJson メソッドを使用します。 getJson には 3 つのパラメータがあります:

I. URL: リクエストアドレス

II. データ: サーバーに送信されるパラメーター

III. コールバック: 成功時の コールバック関数 。

getJson の使用方法は基本的に通常の $.get メソッドと同じですが、getJson では jQuery の後のパラメータ部分に固定部分 callback=? を追加する必要があります。 自動的に置き換えられるのでしょうか？ コールバック関数を実行するための正しい関数名です。次に、外部ドメインから返された json オブジェクトをコールバック関数で操作します。コールバック関数 callback のパラメータは json オブジェクトです。

りー ②サーバーサイド書き込み

サーバーのロジックは主に、データを json string にシリアル化し、それを「コールバック (json)」の形式にカプセル化することです。コールバックは、jQuery によって自動的に生成され、サーバーに渡される関数名です。以下は C# を使用して実装されています:

$.getJSON("http://localhost:3561/User/GetAllNames?callback=?", function(json) { for (var i = 0; i " + json[i] + " "); } }); これで問題は無事解決しました。

思考: コールバックがサーバー上でハードウェア的に記述されている場合 (例: return string.Format("moty({0})", json);)、クライアントはそれをどのように記述すべきでしょうか?

参考:

public class UserController : Controller { public string GetAllNames(string callback) { string[] names = new string[] { "张三丰", "张无忌", "令狐冲", "杨过", "郭靖" }; JavaScriptSerializer jss = new JavaScriptSerializer(); string json = jss.Serialize(names); return string.Format("{0}({1})", callback, json); } } この記事の事例を読んだ後、あなたはその方法をマスターしたと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

ノードのプロセスおよびchild_processモジュールの使用方法の詳細な説明

vue2.0のすべての画像をロードするループメソッド