一、什么是跨域？

跨域 ，指的是浏览器不能执行其他网站的脚本，它是由浏览器的同源策略造成的，是浏览器对 javascript 施加的安全限制 , 防止他人恶意攻击网站。

二、为什么要跨域?

同源策略 : 指的是"协议+域名+端口"三者相同，同源策略实际上是浏览器限制一个域名与另外一个域名的资源的交互的规则。

在前后端分离的模式下，前后端的域名是不一致的，此时就会发生跨域访问的问题。在请求的过程中我们要想请求数据一般都是post/get请求，所以跨域问题出现。

跨域问题来源于JavaScript的同源策略，即只有 协议+主机名+端口号(如存在)相同，则允许相互访问。也就是说JavaScript只能访问和操作自己域下的资源，不能访问和操作其他域下的资源。跨域问题是针对JS和ajax的，html本身没有跨域问题，比如a标签、script标签、甚至form标签（可以直接跨域发送数据并接收数据）等。

三、如何解决跨域 ？

1. JSONP

原理是： 有些标签 script、img、link、iframe ... 这些标签不存在跨域请求的限制，就是利用这个特点解决跨域问题。

JSONP 是服务器与客户端跨源通信的常用方法。

优点：简单适用，兼容性好（可以兼容低版本IE），

缺点：只支持 get 请求，不支持 post 请求，导致数据不安全

核心思想：网页通过添加一个 < script > 元素，向服务器请求 JSON 数据，服务器收到请求后，将数据放在一个指定名字的回调函数的参数位置传回来。

2. CORS 跨域资源共享（Cross-Origin Resource Sharing）。

　　它是新的 W3C 标准，它新增的一组 HTTP 首部字段允许服务器其声明那些来源请求有权访问哪些资源，就是它允许浏览器向其声明了 CORS 的栈进行跨域请求。

　　这种方式最主要的特点就是会在响应的 HTTP 首部增加 Access-Control-Allow-Origin 等信息，从而判定那些资源站可以进行跨域请求，还有几个其他相关的 HTTP 首部进行更加精细化的控制，最主要的还是 Access-Control-Allow-Origin 。

　　CORS 与 JSONP 对比来说又是比较明显，JSONP 只支持 GET 方式，而且 JSONP 并不符合处理业务的正常流程。采用 CORS 的方式，前端编码与正常非跨域请求没有什么不同。

　　　　客户端发送请求（ajax）

　 在真正的发送跨域请求之前会发送一个试探性请求（OPTIONS），服务器接收到 OPTIONS请求之后，做一个处理，返回成功，表示可以发送跨域请求，再发送真正的跨域请求

　　 服务端设置相关的头信息（需要处理试探性请求OPTIONS）

3. 反向代理

跨域常用解决方案。

　　既然不能跨域请求，那么我们不跨域就可以了，通过在请求到达服务器前部署一个服务，将接口请求进行转发，这就是反向代理。通过一定的转发规则可以将前端的请求转发到其他的服务。

　通过反向代理我们将前后端项目统一通过反向代理来提供对外的服务，这样在前端看上去就跟不存在跨域一样。

　　 反向代理麻烦之处就在原对 Nginx 等反向代理服务的配置，在目前前后端分离的项目中很多都是采用这种方式。

除了文中提供的三种方法，还有 websocket、node代理、document.domain + iframe 、window.name + iframe 、location.hash + iframe等几种不同的方式。