web应用之跨域问题

跨域是前端同学绕不过的一个问题，面试必问，日常开发也常常遇到。

今天就来简单聊聊这个问题。

首先，什么是跨域？

跨域是指浏览器针对javascript所作的同源策略限制。

为什么要设置跨域？

基于安全角度考虑。

日常开发中，为什么又需要跨域呢？

涉及到跟不同域进行数据交互，像跟前端的数据交互，跟后端的数据交互，特别是在前后端分离，微服务的时代，跨域更是无处不在，那应该怎么处理这些跨域问题呢？

我们将其分为两类：1）纯前端的跨域 2）前端与后端的跨域

纯前端的跨域：

1. window.name
2. document.domain + iframe (主域相同，子域不同)
3. postMessage + iframe
4. location.hash + iframe

前端与后端的跨域：

4. jsonp
5. cors(跨域资源共享)
6. nginx代理（vue中的反向代理）
7. nodejs中间件代理
8. websocket协议代理

在开发中用到的有window.name, postMessage + iframe, jsonp, cors, nginx等跨域方式

顺手再提一问：为什么后端没有跨域限制？
因为跨域是浏览器对js作的限制，而后端没有这个限制，所以不存在跨域问题。所以一般是通过cors，让后端去别的服务器上拿到数据，再跟前端进行数据交互。