Javaは、corsを利用して、ドメイン間の要求のインスタンスを実現する。


ajax自体は実際にXMLttpRequestオブジェクトを通じてデータのインタラクションを行いますが、ブラウザは安全を考慮して、jsコードのクロスドメイン操作を許可しないので、警告します。
 ウェブサイトの開発は、場合によってはクロスドメインが必要です。
クロスドメインとは何ですか?
ドメインをまたぐと、ブラウザが他のサイトのスクリプトを実行できないということです。これはブラウザの同ソース戦略によってもたらされたもので、JavaScriptに対するブラウザのセキュリティ制限です。
ajax自体は実際にXMLttpRequestオブジェクトを通じてデータのインタラクションを行いますが、ブラウザは安全を考慮して、jsコードのクロスドメイン操作を許可しないので、警告します。
一般的なクロスドメインの解決方法
  • scriptタグ
  • iframe
  • json
  • サービス端末中継要求
  • cos
  • 今日の主役コール
    全称:Cross-Origin Resource Sharing
    日本語の意味:国境を越えた資源の共有
    Wikipediaで定義されているのは、ドメイン間のリソース共有(CORS)は、Webサーバのための方法を定義し、ウェブページが異なるドメインからそのリソースにアクセスできるようにするネットワークブラウザの技術仕様である。このようなアクセスは同源戦略によって禁止されている。CORSシステムは、ドメイン間要求が許可されているかどうかを決定するために、ブラウザとサーバが相互作用する方法を定義している。妥協して、より大きな柔軟性がありますが、これらすべてを簡単に許すよりも安全です。
    ここでは、corsはjava tomcatの下でどのように配置されていますか?
    まず、jarパッケージをダウンロードします
    cors-filterとjava-property-utils
    
    <!-- https://mvnrepository.com/artifact/com.thetransactioncompany/cors-filter -->
    <dependency>
      <groupId>com.thetransactioncompany</groupId>
      <artifactId>cors-filter</artifactId>
      <version>2.5</version>
    </dependency>
    <!-- https://mvnrepository.com/artifact/com.thetransactioncompany/java-property-utils -->
    <dependency>
      <groupId>com.thetransactioncompany</groupId>
      <artifactId>java-property-utils</artifactId>
      <version>1.10</version>
    </dependency>
    web.xmlを変更します
    以下のコードを追加します。他のfilterの前に置いたほうがいいです。
    
    <filter>     
      <filter-name>CORS</filter-name> 
      <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class> 
      <init-param> 
       <param-name>cors.allowOrigin</param-name> 
        <param-value>*</param-value> 
      </init-param> 
      <init-param> 
       <param-name>cors.supportedMethods</param-name> 
        <param-value>GET, POST, HEAD, PUT, DELETE</param-value> 
      </init-param> 
      <init-param> 
       <param-name>cors.supportedHeaders</param-name> 
        <param-value>Accept, Origin, X-Requested-With, Content-Type, Last-Modified</param-value> 
      </init-param> 
      <init-param> 
        <param-name>cors.exposedHeaders</param-name> 
        <param-value>Set-Cookie</param-value> 
      </init-param> 
      <init-param> 
        <param-name>cors.supportsCredentials</param-name> 
        <param-value>true</param-value> 
      </init-param>
    </filter> 
     
    <filter-mapping> 
      <filter-name>CORS</filter-name> 
      <url-pattern>/*</url-pattern> 
    </filter-mapping>
    jQuery要求例
    
    $.ajax("url", {
      type: "POST",
      xhrFields: {
        withCredentials: true,
        useDefaultXhrHeader: false
      },
      data: {
        type: "test"
      },
      dataType: 'json',
      crossDomain: true,
      success: function(data, status, xhr) {
       console.log(data);
      }
    });
    以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。