アクセス制御 - 許可 - 起源はCORS (Cross-Origin Resource Sharing) headerです。
サイトAがサイトBからコンテンツを取得しようとすると、サイトBは、このページのコンテンツが特定の発信元からアクセス可能であることをブラウザに伝えるために、アクセス制御許可原点応答ヘッダーを送信できます。 (原点はドメインであり、スキームとポート番号です。)デフォルトでは、サイトBのページには他の起点からアクセスできません。 Access-Control-Allow-Originヘッダーを使用すると、特定の要求元からのクロスオリジンアクセスの扉が開きます。サイトBがサイトAにアクセスできるように望んでいることを各リソース/ページに対して
、サイトBは、レスポンスヘッダとそのページを提供する必要があります
Access-Control-Allow-Origin: http://siteA.com
最近のブラウザは完全にクロスドメインリクエストをブロックしません。サイトAがサイトBからページを要求する場合、ブラウザは実際に要求されたページをネットワークレベルでフェッチし、応答ヘッダーがサイトAを許可されたリクエスタドメインとしてリストしているかどうかを確認します。サイトBがサイトAがこのページにアクセスすることを許可されていないと示している場合、ブラウザはXMLHttpRequestのエラーイベントをトリガーし、要求しているJavaScriptコードへの応答データを拒否します。
非シンプルなリクエスト:ネットワークレベルで何が起こる
は、上述よりも少し複雑になることがあります。リクエストが"non-simple" requestの場合、ブラウザはまずデータなしの「プリフライト」OPTIONSリクエストを送信し、サーバがリクエストを受け入れることを確認します。要求がGETまたはPOST以外のHTTP動詞を使用している場合、リクエストは単純ではありません(どちらか一方または両方)。
PUT、DELETE) 非シンプルリクエストヘッダーを使用する。 Accept Accept-Language Content-Language Content-Type(これは値がapplication/x-www-form-urlencoded、multipart/form-data、text/plainの場合にのみ簡単です) ) サーバがOPTIONSプリフライトに、非シンプルな動詞および/または非シンプルな動詞に一致する適切なレスポンスヘッダ(非単純ヘッダの場合はAccess-Control-Allow-Headers、非単純動詞の場合はAccess-Control-Allow-または単純ではないヘッダーの場合、ブラウザーは実際の要求を送信します。
サイトAは、アプリケーション/ JSONの非シンプルなContent-Typeの値で、/ somePageのためのPUTリクエストを送信したい、ブラウザが最初のプリフライトリクエストを送信したとすると:
OPTIONS /somePage HTTP/1.1
Origin: http://siteA.com
Access-Control-Request-Method: PUT
Access-Control-Request-Headers: Content-Type
注意していることAccess-Control-Request-Method
とAccess-Control-Request-Headers
がブラウザによって自動的に追加されます。それらを追加する必要はありません。このOPTIONSプリフライトは成功したレスポンスヘッダ
Access-Control-Allow-Origin: http://siteA.com
Access-Control-Allow-Methods: GET, POST, PUT
Access-Control-Allow-Headers: Content-Type
(プリフライトが行われた後に)実際の要求を送信
を取得し、動作が単純な要求の処理方法と同じです。言い換えれば、プリフライトが成功した単純ではない要求は、単純な要求と同じように扱われる(すなわち、サーバは実際の応答のために依然として
Access-Control-Allow-Origin
を送信しなければならない)。
のブラウザでは、実際の要求送信します
PUT /somePage HTTP/1.1
Origin: http://siteA.com
Content-Type: application/json
{ "myRequestContent": "JSON is so great" }
を、サーバが、それは単純な要求のためのと同じように、Access-Control-Allow-Origin
を送り返し:
Access-Control-Allow-Origin: http://siteA.com
について少し詳しくUnderstanding XMLHttpRequest over CORSを参照してください。単純ではない要求。
私は、CORSの問題と解決策をよりよく理解するのに役立つと思います。