まず、クロスドメインの背景
1.1クロスドメインとは何ですか？
Url一般的な形式：
プロトコル+ドメイン（サブドメイン名+メインドメイン名）+ポート番号+リソースロケータ
例：
https://www.dustyblog.cn:8080/say/Helloによる
HTTPS + WWW + dustyblog.cn + 8080 +こんにちは/言う構図
コンポーネント。
限り、メインのドメイン名、ポート番号をサブドメイン契約の一環として、これらの4つの異なる、と考えることができます異なるドメインは、互いに異なるドメイン間のリソースへのアクセスは、それがクロスドメインと呼ばれています。
1.2通常のリクエスト
- コントローラレベルのコード：
1 @RequestMapping（ "/デモ" ） 2 @RestController 3 パブリック クラスCorsTestController { 4 5 @GetMapping（ "/のsayHello" ） 6 公共の文字列のsayHello（）{ 7 リターンの"Hello World！" ; 8 } 9 }
- プロジェクト、テスト要求を開始します
ブラウザが開き、ローカルホストを：8080 /デモ/のsayHello
あなたは「世界hello」をプリントアウトすることができます
1.3クロスドメインのテスト
一例として、Chromeに：
-
：のような、任意のウェブサイトを開きhttps://blog.csdn.net
-
プレスF12、開発ツール[開く]、[内側]コンソール試験JSコードを直接入力してもよいです。
VARトークン= "LtSFVqKxvpS1nPARxS2lpUs2Q2IpGstidMrS8zMhNV3rT7RKnhLN6d2FFirkVEzVIeexgEHgI / PtnynGqjZlyGkJa4 + zYIXxtDMoK / N + AB6wtsskYXereH3AR8kWErwIRvx + UOFveH3dgmdw1347SYjbL / ilGKX5xkoZCbfb1f0 =、LZkg22zbNsUoHAgAUapeBn541X5OHUK7rLVNHsHWDM / BA4DCIP1f / 3Bnu4GAElQU6cds / 0fg9Li5cSPHe8pyhr1Ii / TNcUYxqHMf9bHyD6ugwOFTfvlmtp6RDopVrpG24RSjJbWy2kUOOjjk5uv6FUTmbrSTVoBEzAXYKZMM2m4 =、R4QeD2psvrTr8tkBTjnnfUBw + YR4di + GToGjWYeR7qZk9hldUVLlZUsEEPWjtBpz + UURVmplIn5WM9Ge29ft5aS4oKDdPlIH8kWNIs9Y3r9TgH3MnSUTGrgayaNniY9Ji5wNZiZ9cE2CFzlxoyuZxOcSVfOxUw70ty0ukLVM / 78 ="。
VAR XHR =新しいXMLHttpRequestを（）;
xhr.open（ 'GET'、 'http://127.0.0.1:8080/demo/sayHello'）;
xhr.setRequestHeader（「Xアクセストークン」トークン）。
xhr.send（NULL）。
xhr.onload =関数（E）{
VARのXHR = e.target。
にconsole.log（xhr.responseText）。
要求：結果があることを示すhttps://blog.csdn.net要求は、ドメイン名の下に失敗しました！
第二に、ソリューション - ドメイン間CORS
2.1 CORS何ですか
CORSクロスオリジンリソースの共有（クロスドメイン・リソースの共有）と呼ばれ、各ページは、httpヘッドを返す必要があるアクセス制御 - 許可 - 起源は、ドメイン外のサイトへのアクセスを許可すると呼ばれる、あなただけの限られた資源と制限されたドメインを公開することができますサイトアクセス。
我々は理解することができます：要求がクロスドメインアクセスを許可する必要がある場合、あなたはする必要があるhttpヘッダーを設定します
アクセス制御-許可-起源は、サイトがアクセスを許可する必要があるかを決定します。仮定はHTTPSを許可する必要があります：// クロスドメインのサイトwww.dustyblog.c要求を、提供することができる。 アクセス -制御-許可-起源：HTTPS：// www.dustyblog.cn。
クロスドメインCORSを解決する方法2.2
2.2.1オプション1：使用の@CrossOrigin注釈
Controller使用@CrossOriginノート、クラス内のすべてのインターフェイスは、クロスドメインアクセスを介して利用可能です
1（ "/ DEMO2" RequestMapping @ ） 2 @RestController 3 // @CrossOrigin // クラスの下のすべてのドメイン名は、すべてのインターフェイスにアクセスできる 4 @CrossOrigin（ "https://blog.csdn.netを"）// ドメイン名のみを指定しますすべてのインターフェイスにそのようなアクセス下 5つの。 パブリック クラスCorsTest2Controller { 6。 7。 @GetMapping（ "/のsayHello" ） 8。 公共ストリングのsayHello（）{ 9。 復帰の"Hello World --- 2" ; 10 } 11 }
現在は、ここで指定されたCorsTest2Controller処理するすべての方法https://csdn.netあなたがテストすることができ、ドメイン上の要求を、：
- でhttps://blog.csdn.net、デバッグウィンドウを開き、ページを入力します（注：このアドレスは、要求され
/demo2、1.2の場合と区別してください/demo）
VARトークン= "LtSFVqKxvpS1nPARxS2lpUs2Q2IpGstidMrS8zMhNV3rT7RKnhLN6d2FFirkVEzVIeexgEHgI / PtnynGqjZlyGkJa4 + zYIXxtDMoK / N + AB6wtsskYXereH3AR8kWErwIRvx + UOFveH3dgmdw1347SYjbL / ilGKX5xkoZCbfb1f0 =、LZkg22zbNsUoHAgAUapeBn541X5OHUK7rLVNHsHWDM / BA4DCIP1f / 3Bnu4GAElQU6cds / 0fg9Li5cSPHe8pyhr1Ii / TNcUYxqHMf9bHyD6ugwOFTfvlmtp6RDopVrpG24RSjJbWy2kUOOjjk5uv6FUTmbrSTVoBEzAXYKZMM2m4 =、R4QeD2psvrTr8tkBTjnnfUBw + YR4di + GToGjWYeR7qZk9hldUVLlZUsEEPWjtBpz + UURVmplIn5WM9Ge29ft5aS4oKDdPlIH8kWNIs9Y3r9TgH3MnSUTGrgayaNniY9Ji5wNZiZ9cE2CFzlxoyuZxOcSVfOxUw70ty0ukLVM / 78 ="。
VAR XHR =新しいXMLHttpRequestを（）;
xhr.open（ 'GET'、 'http://127.0.0.1:8080/demo2/sayHello'）;
xhr.setRequestHeader（「Xアクセストークン」トークン）。
xhr.send（NULL）。
xhr.onload =関数（E）{
VARのXHR = e.target。
console.log（xhr.responseText）。
}
リターンの結果：
ƒ（E）{
VARのXHR = e.target。
console.log（xhr.responseText）。
}
VM156：8のHello World --- 2
説明クロスドメインの成功！
- ドメインがまだ有効でクロスドメインであるかどうかを確認するために別の試験では、中https://www.baidu.comその上、テスト、結果を返します。
OPTIONS http://127.0.0.1:8080/demo2/sayHello 403
（匿名）
'http://127.0.0.1:8080/demo2/sayHello'でのXMLHttpRequestのへのアクセス
、原点からの'http://www.cnblogs.com' CORSポリシーによってブロックされました：
プリフライトリクエストへの応答は、アクセス制御チェックに合格しない：
いいえ「アクセス制御-許可-起源」ヘッダは、要求されたリソース上に存在します。
説明クロスドメインの失敗！プログラムは、成功したクロスドメインは、ドメイン名の一部を指定することができる証明しました！
2.2.2オプション2：CORSグローバル設定 - を達成しますWebMvcConfigurer
- 新しいクロスドメインの設定クラス：
CorsConfig.java：
1 / ** 2 *跨域配置 3 * / 4 @Configuration 5つの パブリック クラス CorsConfigが実装{WebMvcConfigurerを 6 7 @Bean 8 公共WebMvcConfigurer corsConfigurer（） 9 { 10 リターン 新しいWebMvcConfigurer（）{ 11 @Override 12 公共 ボイドaddCorsMappings（CorsRegistryレジストリ）{ 13 registry.addMapping（ "/ **" ）。 14 allowedOrigins（「https://www.dustyblog.cn」）。// 許可クロスドメインは、あなたが任意のドメイン名を使用することができます*の使用許可 15 allowedMethods（「*」）を。//ができます任意の方法（郵便、取得、など） 16 allowedHeaders（ "*"）。// すべての要求ヘッダーを可能にする 17。 allowCredentials（trueに）。// テープクッキー情報 18である exposedHeaders（HttpHeaders.SET_COOKIE）.maxAge（3600L）; // MAXAGE（3600）は3600秒でいることを示しました。プリチェック要求を送信する必要がない、結果をキャッシュすることができる 19 } 20 }; 21 } 22 }
- ドメイン名へのアクセスを可能にするテスト、https://www.dustyblog.cn/のコンソール入力を（この要求はhttp://127.0.0.1:8080/demo3であることに注意）。
VARトークン= "LtSFVqKxvpS1nPARxS2lpUs2Q2IpGstidMrS8zMhNV3rT7RKnhLN6d2FFirkVEzVIeexgEHgI / PtnynGqjZlyGkJa4 + zYIXxtDMoK / N + AB6wtsskYXereH3AR8kWErwIRvx + UOFveH3dgmdw1347SYjbL / ilGKX5xkoZCbfb1f0 =、LZkg22zbNsUoHAgAUapeBn541X5OHUK7rLVNHsHWDM / BA4DCIP1f / 3Bnu4GAElQU6cds / 0fg9Li5cSPHe8pyhr1Ii / TNcUYxqHMf9bHyD6ugwOFTfvlmtp6RDopVrpG24RSjJbWy2kUOOjjk5uv6FUTmbrSTVoBEzAXYKZMM2m4 =、R4QeD2psvrTr8tkBTjnnfUBw + YR4di + GToGjWYeR7qZk9hldUVLlZUsEEPWjtBpz + UURVmplIn5WM9Ge29ft5aS4oKDdPlIH8kWNIs9Y3r9TgH3MnSUTGrgayaNniY9Ji5wNZiZ9cE2CFzlxoyuZxOcSVfOxUw70ty0ukLVM / 78 ="。
VAR XHR =新しいXMLHttpRequestを（）;
xhr.open（ 'GET'、 'http://127.0.0.1:8080/demo3/sayHello'）;
xhr.setRequestHeader（「Xアクセストークン」トークン）。
xhr.send（NULL）。
xhr.onload =関数（E）{
VARのXHR = e.target。
console.log（xhr.responseText）。
}
リターンの結果：
ƒ（E）{
VARのXHR = e.target。
console.log（xhr.responseText）。
}
VM433：8のHello World --- 3
そのような別のURLとして、クロスドメインの成功を説明https://www.baidu.comテストはまだ設定は、プログラムテスト正しいことを証明するために、クロスドメインエラーが発生する必要があります。
2.2.3オプション3：インターセプタを達成するためのフィルタ
実装することでFiter、要求にインターフェースをいくつか追加しHeader、クロスドメインを解決するために問題を
1 @Component 2 パブリック クラス CorsFilterが実装フィルタ{ 3 4 @Override 5 公共 ボイドのdoFilter（のServletRequest要求たServletResponse応答れるFilterChain鎖） 6 スローにIOException、ServletExceptionが{ 7 HttpServletResponseのRES = （HttpServletResponseの）応答を 8 res.addHeader（ "とAccess-Control-Allow-Credentials"、 "真" ）。 9 res.addHeader（「アクセス制御-許可原点」、「*」）。 10 res.addHeader（ "アクセス・コントロール・-メソッド許可する"、 "POSTは、PUT、DELETE GET" ）; 11 res.addHeader（ "アクセス制御-許可-ヘッダ"、 "コンテンツタイプ、X-CAF-認証トークン、はsessionToken、X-TOKEN" ）; 12 であれば（（（HttpServletRequestの）要求）.getMethod（）に等しい（ "OPTIONS"。 ））{ 13 response.getWriter（）のprintln（ "OK" ）; 14 リターン; 15 } 16 chain.doFilter（リクエスト、レスポンス）。 17 } 18 @Override 19 公共 ボイドは（破壊）{ 20 } 21 @Override 22 公共の ボイドのinit（に、FilterConfigに、FilterConfig）はスローServletExceptionが{ 23 } 24 }
これまでのところ、クロスドメインリクエストが完了し、より多くの、より良い方法の友人が歓迎のメッセージがあります！
：から学ぶことの周りに良いテキストhttps://www.cnblogs.com/vandusty/p/11408422.html