基本コンセプト

クロスドメイン（CORS）要求：同一生成元ポリシー/ SOP（同一生成元ポリシーが）大会で、1995年にNetscapeがブラウザを導入し、それがブラウザのコアは、最も基本的なセキュリティ機能、同一生成元ポリシーの欠如されていますブラウザは、XSS、CSFR攻撃に対して脆弱です。相同でも二つの異なるドメイン名が同じIPアドレス、また同族体を指し、いわゆる「プロトコル+ドメイン名+ポート、」同じ3つを指します。

クロスドメイン（CORS）の決定を達成するための原理、ブラウザとサーバー

問題の説明

ヒントaxiosが、クロスドメインリクエストとリターンデータ200

分析

行動を以下のいくつかの同一生成元ポリシーの制限：

1.）クッキー、のlocalStorageとIndexDBを読み取ることができません

2.）DOMオブジェクトを取得し、Jsとすることはできません

3）AJAXリクエストを送信することができません

一般的なクロスドメインのシナリオ

1）同じドメイン名の下に別のファイルまたはパスを、アクセスが許可されます。

http://www.domain.com/a.js

http://www.domain.com/b.js

http://www.domain.com/lab/c.js

2.）同じドメイン名の異なるポートで、アクセスを許可していません。

http://www.domain.com:8000/a.js

http://www.domain.com/b.js

3）同じドメイン名で異なるプロトコル、アクセスを許可していません。

http://www.domain.com/a.js

https://www.domain.com/b.js

4.）同じIPアドレスの下で異なるドメイン名の間、それはアクセスを許可していません。

http://www.domain.com/a.js

http://192.168.4.12/b.js

5.）異なるドメイン間のアクセスを許可していません。

http://www.domain1.com/a.js

http://www.domain2.com/b.js

ソリューション

方法1：要求でリソースファイルに「アクセス制御 - 許可 - 起源」を追加

(1)如果被请求的是静态HTML文件，则需要只需要在被请求的HTML文件中加上一下标签。

<meta http-equiv="Access-Control-Allow-Origin" content="*" />

(2)如果被请求的是java接口，则可以在响应头中加上：

response.setHeader("Access-Control-Allow-Origin", "http://www.domain1.com");

(3)如果被请求的是.net接口，则可以在响应头中加上：

Response.AddHeader("Access-Control-Allow-Origin", "*");

方法二：通过jsonp请求

跨域原理：通常为了减轻web服务器的负载，我们把js、css，img等静态资源分离到另一台独立域名的服务器上，在html页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许，基于此原理，我们可以通过动态创建script，再请求一个带参网址实现跨域通信。

原生实现：

 <script>
    var script = document.createElement('script');
    script.type = 'text/javascript';

    // 传参并指定回调执行函数为onBack
    script.src = 'http://www.domain2.com:8080/login?user=admin&callback=onBack';
    document.head.appendChild(script);

    // 回调执行函数
    function onBack(res) {
        alert(JSON.stringify(res));
    }
 </script>

jQuery实现：

$.ajax({
    url: 'http://www.domain2.com:8080/login',
    type: 'get',
    dataType: 'jsonp',  // 请求方式为jsonp
     crossDomain: true,
     success: function(data) {},
    data: {}
});

方法三：通过设置代理

跨域原理：同源策略是浏览器的安全策略，不是HTTP协议的一部分。服务器端调用HTTP接口只是使用HTTP协议，不会执行JS脚本，不需要同源策略，也就不存在跨越问题。

以下提供java/.net跨域文件的源码，请自行发布使用。请求代理文件源码地址：

https://github.com/muziye2013/CrossDomainAccessProxy

a. 如果是.NET开发环境，请将下载的“DotNet”源码发布为网站

并将网站的物理路径，指向源码DotNet地址:

修改index.html页面中被请求的资源，在浏览器中访问index.html页面进行测试。

 var testUrl="http://172.17.0.130/***/query";//修改测试服务地址

b.如果是Java开发环境，请将下载的“Java”源码放在tomcat网站下的webapps目录下，

修改index.html页面中被请求的资源，启动tomcat，在浏览器中访问index.html页面进行测试。

方法四：通过Nginx反向代理

实现思路：通过nginx配置一个代理服务器（域名与domain1相同，端口不同）做跳板机，反向代理访问domain2接口，并且可以顺便修改cookie中domain信息，方便当前域cookie写入，实现跨域登录。

nginx具体配置：

#proxy服务器
server {
    listen       81;
    server_name  www.domain1.com;

    location / {
        proxy_pass   http://www.domain2.com:8080;  #反向代理
        proxy_cookie_domain www.domain2.com www.domain1.com; #修改cookie里域名
        index  index.html index.htm;

        # 当用webpack-dev-server等中间件代理接口访问nignx时，此时无浏览器参与，故没有同源限制，下面的跨域配置可不启用
        add_header Access-Control-Allow-Origin http://www.domain1.com;  #当前端只跨域不带cookie时，可为*
        add_header Access-Control-Allow-Credentials true;
    }
}

https://segmentfault.com/a/1190000011145364