自己在实际开发中用的跨域方法小结
- 为什么会跨域：浏览器的安全策略，对仅仅是浏览器自己本事的限制，后台不受影响。
如何解决跨域
- 粗暴的方式（仅建议debug阶段）
既然是浏览器的安全策略那就禁用浏览器的安全策略得了
首先是先关闭浏览器然后打开终端运行下面的代码，然后你的浏览器就不受跨域限制了
// 完全退出浏览器
// mac禁用跨域策略 chmod +x [chrome.sh](http://chrome.sh/)
open -a Google\ Chrome --args --disable-web-security --user-data-dir
// window禁用跨域策略
"windows下chrome安装路径" --disable-web-security --user-data-dir
"C:\Users\UserName\AppData\Local\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir
- 经典的jsonp
JSONP, 全称 JSON with Padding，是使用 AJAX 实现的请求不同源的跨域。其基本原理：网页通过添加一个 <script> 元素，向服务器请求 JSON 数据，这种做法（src）不受同源政策限制；服务器收到请求后，将数据放在一个指定名字的回调函数里传回来。
缺点也很明显，只支持get
// 当前页面 a.com/a.html
<script type="text/javascript">
//回调函数
function callback(data) {
alert(data.message);
}
</script>
<script type="text/javascript" src="http://b.com/test.js"></script>
// test.js
// 调用callback函数，并以json数据形式作为阐述传递，完成回调
callback({message:"success"});
- CORS
CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。
具体细节请参照阮一峰老师的博客 ： http://www.ruanyifeng.com/blog/2016/04/cors.html
- 既然后端不受跨域的影响 那就写个同源的node服务器去代理请求就是了
这样诞生了 proxy等方法
proxyTable: {
'/api':{ // api省略host
target: 'http://ap.staging.dns.somegongsi.com:5000', //真正需要请求的地址
changeOrigin: true,
pathRewrite: {
'^/api': '/api'
}
},
'/g3':{ //配置多个字段
target: 'http://ap.staging.dns.somegongsi.com:5000',
changeOrigin: true,
pathRewrite: {
'^/g3': '/g3'
}
}
},
