前端跨域及解决方法

什么是跨域？
当一个请求url的协议、域名、端口三者之间的任意一个与当前页面url不同即为跨域

当前页面url                 被请求页面url                  是否跨域                        原因
http://www.test.com/    http://www.test.com/index.html    否    同源（协议、域名、端口号相同）
http://www.test.com/    https://www.test.com/index.html    跨域    协议不同（http/https）
http://www.test.com/    http://www.baidu.com/                  跨域    主域名不同（test/baidu）
http://www.test.com/    http://blog.test.com/                        跨域    子域名不同（www/blog）
http://www.test.com:8080/    http://www.test.com:7001/     跨域    端口号不同（8080/7001）

二、为什么会出现跨域？
出于浏览器的*同源策略限制**。

同源策略（Same Orgin Policy）是一种约定，它是浏览器核心也最基本的安全功能，它会阻止一个域的js脚本和另外一个域的内容进行交互，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。。所谓同源（即在同一个域）就是两个页面具有相同的协议（protocol）、主机（host）和端口号（port）。

三、非同源限制
无法读取非同源网页的cookie、localstorage和indexedDB
无法接触非同源网页的DOM和js对象
无法向非同源地址发送Ajax请求

四、常用解决方案
（1）document.domain + iframe跨域
（2）location.hash + iframe跨域
（3）window.name + iframe跨域
（4）postMessage跨域
（5）通过jsonp跨域
（6）跨域资源共享（CORS）
（7）Nginx反向代理
（8）nodejs中间件地代理跨域
（9）WebSocket协议跨域
详细解决方法推荐去原网址去看：https://www.cnblogs.com/sdcs/p/8484905.html