jsonp実装原理の分析

1. jsonp の実装原理は、リソースへのクロスドメイン アクセスの目的を達成するために、スクリプト タグを使用してさまざまなソース リソースの特性を取得することです。具体的な動作は次のとおりです。

1. script タグを作成し、その src 属性にリクエスト アドレスを書き込み、このスクリプトの外部リンクを head タグに挿入します。

2. コールバック関数 callback を宣言します。関数名は次のとおりです。リクエストアドレスと一致しています;

3. リクエストアドレスの内容は、パラメータとしてjsonオブジェクトを取る実行関数コールバックです;

4. スクリプトリソースがロードされると、コールバックは実行を開始し、jsonデータを出力します。

5. jsonpは実際にはjsonパディングであり、jsonデータをラップする関数がパディングです。

// 简单的mock jsonpvar mockJsonp = function(url) {var ele = document.createElement('script');var head = document.getElementsByTagName('head')[0];
    ele.src = url;
    head.appendChild(ele);
}
mockJsonp('./index.js');function callback(data){
    console.log(data);
}// index.jscallback("name": "xxx", "age": "20");

2. jq の ajax リクエスト データ形式が jsonp の場合、次の操作が行われます。最初に script タグを構築し、次に onload コールバックを登録し、最後に構築された script タグを挿入します。挿入が完了すると、つまり、onload コールバックがトリガーされ、以前に挿入された script タグが削除されます。コード callback(200, "success") は、実際には、ajax の jsonp を正常にトリガーする成功コールバック関数です。コールバック関数は、実際には完了した関数です。

3. クロスドメイン jsonp は get リクエストのみにすることができます。jq がクロスドメインの jsonp をカプセル化すると、get または post を指定しても、get リクエストに置き換えられます。

4. その他のクロスドメインメソッド

1. cors (Cross-Origin Resource Sharing) クロスドメインリソース共有では、サーバー側で Access-Control-Allow-Origin を設定し、ブラウザが対応する設定を検出した場合にアクセスします。

2. document.domain を変更し、サブドメインとメイン ドメインの document.domain を同じメイン ドメインに設定します。

3. window.name の各ページには window.name に対する読み取り権限と書き込み権限があります。 、ウィンドウ名はウィンドウによってロードされるすべてのページに保持されます。

以上がjsonp実装原理の分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。