前后端数据交互经常会碰到恳求跨域，什么是跨域，以及有哪几种跨域方法，这是本文要讨论的内容。

  当协议、子域名、主域名、端口号中恣意一个不相一起，都算作不同域。不同域之间彼此恳求资源，就算作“跨域”。常见跨域场景如下图所示：翻开网易新闻 检查精彩图片

  第二：在跨域问题上，仅仅是经过“URL的首部”来辨认而不会依据域名对应的IP地址是否相同来判别。“URL的首部”能够理解为“协议, 域名和端口有必要匹配”。

  跨域并不是恳求发不出去，恳求能宣布去，服务端能收到恳求并正常回来成果，仅仅成果被浏览器阻拦了。你可能会疑问分明经过表单的方法能够建议跨域恳求，为什么 Ajax 就不会?由于归根到底，跨域是为了阻挠用户读取到另一个域名下的内容，Ajax 能够获取呼应，浏览器以为这不安全，所以阻拦了呼应。可是表单并不会获取新的内容，所以能够建议跨域恳求。一起也说明晰跨域并不能彻底阻挠 CSRF，由于恳求毕竟是宣布去了。

  Websocket是HTML5的一个耐久化的协议，它完成了浏览器与服务器的全双工通讯，一起也是跨域的一种处理方案。WebSocket和HTTP都是应用层协议，都根据 TCP 协议。可是WebSocket 是一种双向通讯协议，在树立衔接之后，WebSocket 的 server 与 client 都能主意向对方发送或接纳数据。一起，WebSocket 在树立衔接时需求凭借 HTTP 协议，衔接树立好了之后 client 与server之间的双向通讯就与 HTTP 无关了。

  原生WebSocket API运用起来不太便利，咱们运用Socket.io，它很好地封装了webSocket接口，供给了更简略、灵敏的接口，也对不支撑webSocket的浏览器供给了向下兼容。

  完成原理：同源战略是浏览器需求遵从的规范，而如果是服务器向服务器恳求就无需遵从同源战略。署理服务器，需求做以下几个过程：

  咱们先来看个比方：本地文件index.html文件，经过署理服务器向方针服务器恳求数据。

  上述代码经过两次跨域，值得注意的是浏览器向署理服务器发送恳求，也遵从同源战略，最终在index.html文件打印出{title:fontend,password:123456}

  完成原理类似于Node中心件署理，需求你建立一个中转nginx服务器，用于转发恳求。

  运用nginx反向署理完成跨域，是最简略的跨域方法。只需求修正nginx的装备即可处理跨域问题，支撑一切浏览器，支撑session，不需求修正任何代码，而且不会影响服务器功能。

  完成思路：经过nginx装备一个署理服务器（域名与domain1相同，端口不同）做跳板机，反向署理拜访domain2接口，而且能够趁便修正cookie中domain信息，便利当时域cookie写入，完成跨域登录。

  # 当用webpack-dev-server等中心件署理接口拜访nignx时，此刻无浏览器参加，故没有同源约束，下面的跨域装备可不启用

  window.name特点的共同之处：name值在不同的页面（乃至不同域名）加载后仍旧存在，而且能够支撑十分长的 name 值（2MB）。

  总结：经过iframe的src特点由外域转向本地域，跨域数据即由iframe的window.name从外域传递到本地域。这个就奇妙地绕过了浏览器的跨域拜访约束，但一起它又是安全操作。

  完成原理： a.html欲与c.html跨域彼此通讯，经过中心页b.html来完成。 三个页面，不同域之间使用iframe的location.hash传值，相同域之间直接js拜访来通讯。

  该方法只能用于二级域名相同的情况下，比方和b.test.com适用于该方法。 只需求给页面增加document.domain=test.com表明二级域名都相同就能够完成跨域。

  完成原理：两个页面都经过js强制设置document.domain为根底主域，就完成了同域。

  JSONP只支撑GET恳求，JSONP的优势在于支撑旧式浏览器，以及能够向不支撑CORS的网站恳求数据。

  不管是Node中心件署理仍是nginx反向署理，主要是经过同源战略对服务器不加约束。