はじめに:どのようなクロスドメインはい?
クロスドメインの概念を知るために、のは、どのように同じドメイン明確にしましょう:
同じドメインが同じプロトコル、同じIP、同じポートを参照してください。
トリプル異なるクロスドメインが生じるものがある場合。
分離のフロントエンドは、プロジェクトを実行する場合、ポートを介してバックグラウンドのAJAX要求は、必然的にクロスドメインであります
例えば:
私は、HTMLを経由してアクセスするためのフロントエンドサーバーのNode.jsバックエンドインターフェイスを開始します
以下のクロスドメイン・エラーの障害が発生しました
CORSは、クロスドメインの問題を解決します
CORSは、W3C標準である「クロスオリジンリソースの共有」(クロスオリジンリソース共有)の略です。これは、ソースサーバを横断するブラウザは、AJAXのみ相同使用の限界を克服し、要求にXMLHttpRequestを発行できます。
基本的には現在のすべてのブラウザが標準CORSを実装し、実際には、ほとんどすべてのブラウザのAJAX要求がCORSメカニズムに基づいていますが、実際には主な解決策は今CORSになるように、通常はフロントエンドの開発者は、(それを気にしないこと)バックグラウンドを達成する方法の問題を考えます
私たちは、Javaで実現するには、ソース、ヘッドセット、クロスドメインのメソッドを許可するようにフィルタを作成しています
コードは以下の通りであります:
/ * * *クロスドメイン設定 * / @Configuration パブリック クラスCorsConfig { // 設定許可クロス源 プライベート 静的文字列[] = originsVal 新しい新しい文字列[] { " 127.0.0.1:8080 " 、 " localhostを:8080 " 、 " Google.com " }; / * * *クロスドメインフィルタ * * @return * / @Bean 公共CorsFilter corsFilter(){ UrlBasedCorsConfigurationSourceソース = 新しい新UrlBasedCorsConfigurationSource(); CorsConfiguration corsConfiguration = 新しいCorsConfiguration(); この.addAllowedOrigins(corsConfiguration)。 corsConfiguration.addAllowedHeader(" * " ); corsConfiguration.addAllowedMethod(" * " ); corsConfiguration.addAllowedOrigin(" * " ); source.registerCorsConfiguration(" / ** " 、corsConfiguration)。 返す 新しいCorsFilter(ソース)。 } プライベート のボイドaddAllowedOrigins(CorsConfiguration corsConfiguration){ のための(文字列の起源:originsVal){ corsConfiguration.addAllowedOrigin(" のhttp:// " + 起源)。 corsConfiguration.addAllowedOrigin(" https://で" + 起源)。 } } }
サーバー構成を再起動するために、このカテゴリを書き込んだ後、あなたは適切にページの表示を見ることができます
付録
拡張情報: