JavaScriptを使ってさまざまなクロスドメインメソッドを実装する_基礎知識

1. いくつかの概念

①従来の Ajax: インタラクティブなデータ形式 - カスタム文字列または XML 記述。

クロスドメイン - サーバー側プロキシを通じて解決されます。

②今日の最善の解決策: JSON 形式を使用してデータを送信し、JSONP を使用してドメインを越えます。

③JSON: データ交換形式。プレーンテキストに基づいており、ネイティブ JS によってサポートされています。

形式: 2 つのデータ型記述子: 中括弧 { } と角括弧 [ ]。区切り文字のカンマ、マッピング文字のコロン、および定義文字は二重引用符です。

④JSONP: クロスドメインデータ対話プロトコル、非公式。

1. Web ページは、ドメインをまたぐことができる js ファイルを呼び出します。拡張機能: src 属性を持つタグにはクロスドメイン機能があります。

2. クロスドメインサーバーは、クライアント呼び出し用にデータを動的に生成し、js ファイル (通常は json サフィックス付き) に保存します。

3. クライアントがデータを使用しやすくするために、JSONP と呼ばれる非公式の送信プロトコルが形成されます。このプロトコルの焦点は、ユーザーがコールバック パラメーターをサーバーに渡せるようにすることです。サーバーがデータを返すときに、このコールバック パラメーターが関数名として使用されて JSON データをラップし、クライアントが独自の関数をカスタマイズできるようにします。返されたデータを自動的に処理します。

2. JSONP 実装

例 1 - クライアントによる一方的な受け取り:

①クライアント - クライアント設定で関数オブジェクトを作成します。名前は callFunc で、サーバーから js データを受信して​​処理するために使用されます。

js データの核心は次のとおりです。callFunc 関数の呼び出しには、データ オブジェクトの値であるパラメーターが伴います。

コードをコピー コードは次のとおりです:

②サーバー側 - クライアントjs内の関数を直接呼び出してデータを渡します。

コードをコピー コードは次のとおりです。

callFunc({"result":"value1 "}) ;

例 2 - クライアントは指定された関数名をサーバーに送信し、サーバーは関数名を受信して​​、対応する関数を呼び出してデータをパラメータとして渡します。

コードをコピー コードは次のとおりです:

概要: 実装されたコードは複雑ではありませんが、Ajax クロスドメイン、frameset/iframe クロスドメインなどを実装する場合に非常に効率的です。