跨域简介及10种主流跨域方案，前端必备！

跨域简介

跨域，是指从一个域名的网页向另一个域名下的资源发起请求。由于浏览器同源策略的限制，不同域名的网页之间无法直接通信，从而导致跨域请求失败。

10种主流跨域方案

1. CORS（跨域资源共享）

CORS（跨域资源共享）是一种W3C标准，它允许浏览器向跨域服务器发送请求，并允许服务器设置响应头以允许跨域请求。CORS是目前最流行的跨域方案，支持所有主流浏览器。

2. JSONP（JSON with Padding）

JSONP是一种使用<script>标签的跨域方案。它将JSON数据封装在<script>标签中，然后加载<script>标签。由于<script>标签没有跨域限制，因此可以实现跨域请求。

3. WebSocket协议跨域

WebSocket协议是一种用于在浏览器和服务器之间进行全双工通信的协议。WebSocket协议支持跨域通信，因此可以通过WebSocket协议实现跨域请求。

4. nginx代理跨域

nginx代理跨域是一种使用nginx代理服务器实现跨域请求的方案。nginx代理服务器可以将跨域请求转发到目标服务器，并返回目标服务器的响应。

5. nodejs中间件代理跨域

nodejs中间件代理跨域是一种使用nodejs中间件实现跨域请求的方案。nodejs中间件可以将跨域请求转发到目标服务器，并返回目标服务器的响应。

6. 浏览器屏蔽安全校验

浏览器屏蔽安全校验是一种通过修改浏览器的安全策略来实现跨域请求的方案。浏览器屏蔽安全校验不符合W3C标准，因此不建议使用。

7. postMessage跨域

postMessage跨域是一种使用HTML5的postMessage API实现跨域通信的方案。postMessage API允许两个窗口之间发送消息，因此可以通过postMessage API实现跨域请求。

8. document.domain跨域

document.domain跨域是一种通过设置document.domain属性来实现跨域请求的方案。document.domain属性可以将多个域名的document对象指向同一个域，从而实现跨域请求。

9. window.name跨域

window.name跨域是一种通过设置window.name属性来实现跨域通信的方案。window.name属性可以存储数据，因此可以通过window.name属性实现跨域请求。

10. location.hash跨域

location.hash跨域是一种通过设置location.hash属性来实现跨域通信的方案。location.hash属性可以存储数据，因此可以通过location.hash属性实现跨域请求。