一、什么是跨域？
- 要了解跨域，首先明白浏览器的同源策略，同源策略是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSRF等攻击。所谓同源是指，协议，域名，端口，三者相同；不同源：协议，域名，端口，三者任意一个不同请求就算‘跨域’；同源策略限制内容有：Cookie、LocalStorage、IndexedDB 等存储性内容，AJAX 请求发送后，结果被浏览器拦截了，DOM 节点；但是有三个标签是允许跨域加载资源：img标签，link标签，script标签；跨域并不是请求发不出去，请求能发出去，服务端能收到请求并正常返回结果，只是结果被浏览器拦截了。
二、跨域解决方案
-
jsonp是利用script标签没有跨域限制的漏洞，网页可以得到从其他来源动态产生的 JSON 数据。JSONP请求一定需要对方的服务器做支持才可以；JSONP优点是简单兼容性好，可用于解决主流浏览器的跨域数据访问的问题。缺点是仅支持get方法具有局限性,不安全可能会遭受XSS攻击
-
CORS（跨域资源共享） 需要浏览器和后端同时支持，浏览器会自动进行 CORS 通信，实现 CORS 通信的关键是后端。只要后端实现了 CORS，就实现了跨域；服务端设置 Access-Control-Allow-Origin：* 就可以开启 CORS，通过这种方式解决跨域问题的话，会在发送请求时出现两种情况，分别为简单请求和复杂请求。
-
简单请求：GET，HEAD，POST方法之一；Content-Type：（text/plain，multipart/form-data，application/x-www-form-urlencoded，三者之一）
-
复杂请求：复杂请求的CORS请求，会在正式通信之前，增加一次HTTP查询请求，称为预检请求,该请求是 option 方法的，通过该请求来知道服务端是否允许跨域请求。
-
postMessage是HTML5中的API，它可以解决：页面和其打开的新窗口的数据传递，多窗口之间消息传递，页面与嵌套的iframe消息传递，Window.postMessage(message, targetOrigin, transfer[可选])；message: 将要发送到其他 window的数据；targetOrigin：通过窗口的origin属性来指定哪些窗口能接收到消息事件，其值可以是字符串* （表示无限制）
-
Websocket是HTML5的一个协议，它实现了浏览器与服务器的全双工通信，WebSocket和HTTP都是应用层协议，都基于 TCP 协议，在建立连接之后，WebSocket 的 server 与 client 都能主动向对方发送或接收数据，WebSocket 在建立连接时需要借助 HTTP 协议，连接建立好了之后 client 与 server 之间的双向通信就与 HTTP 无关了。
-
nginx反向代理，需要你搭建一个中转nginx服务器，用于转发请求，只需要修改nginx.conf的配置即可解决跨域问题,简单配置如下：
server {
listen 80;
server_name www.test1.com;
location / {
proxy_pass http://www.test2.com:8080; 反向代理
index index.html index.htm;
}
}
三、总结
- 日常工作中，用得比较多的跨域方案是cors和nginx反向代理
