ドメインを越えて本当に理解しましたか?ドメイン間リクエストの実装

1、ドメイン間とは何ですか.
ドメイン間では、ブラウザが他のWebサイトのスクリプトを実行できないことを意味します.これはブラウザの同源ポリシーによってもたらされ、ブラウザが適用するセキュリティ制限である.ブラウザの同源ポリシーのため、urlを要求するプロトコル、ドメイン名、ポートの3つの間のいずれかが現在のページアドレスと異なる場合、ドメイン間である.ドメイン間の状況:

ネットワークプロトコルは、httpプロトコルなどのhttpプロトコルがhttpプロトコルにアクセスするのとは異なります.

ポートは、8080ポートが8081ポートにアクセスするなど、異なる.

ドメイン名はblog.comなどと異なりbaidu.comにアクセスします.

ドメイン名とドメイン名対応ip、例えばwww.a.comアクセス20.205.28.90.

localhostと127.0.0.1はいずれも本機を指すが、ドメイン間

にも属する.
2、ドメイン間でリソースを要求する方法:
(1)、porxyエージェント
定義と使用法:proxyエージェントは、リクエストをバックグラウンドサーバに送信し、サーバを介してリクエストを送信し、リクエストの結果をフロントエンドに渡すために使用します.
実装方法:nginxエージェントを介して;
注意点:1、httpsプロトコルのリクエストをエージェントしている場合は、proxyはまず証明書(特にカスタム証明書)を信頼するか、証明書チェックを無視する必要があります.そうしないと、リクエストは成功しません.
(2)、CORS 【Cross-Origin Resource Sharing】
定義と使用法:現代のブラウザがドメイン間リソースリクエストをサポートする最も一般的な方法です.
使用方法:一般的に、バックエンド担当者が要求データを処理するときに、ドメイン間で許可される関連操作を追加する必要があります.次のようになります.

res.writeHead(200, {
    "Content-Type": "text/html; charset=UTF-8",
    "Access-Control-Allow-Origin":'http://localhost',
    'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
    'Access-Control-Allow-Headers': 'X-Requested-With, Content-Type'
});

(3)、jsonp
定義と使用法:scriptラベルを動的に挿入します.ブラウザはscriptのリソース参照に同源制限を持たず、リソースがページにロードされるとすぐに実行します(ブロックがない場合).
特徴:場合によってはscriptを動的に作成して他のドメインの動的リソースを読み出し、取得したデータは一般的にjson形式である.
例は次のとおりです.

    function testjsonp(data) {
       console.log(data.name); //        
    }


    var _script = document.createElement('script');
    _script.type = "text/javascript";
    _script.src = "http://localhost:8888/jsonp?callback=testjsonp";
    document.head.appendChild(_script);

この書き方に注意してください. 

この方式ではpost要求(ここ)

を送信できない.

さらにjsonpのリクエストが失敗したかどうかを決定するのは容易ではなく、多くのフレームワークの実装はタイムアウト時間と組み合わせて判定される.