跨域解决方案🔨
一、前言👁
什么是跨域?
当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域
就是【不同源】导致【无法发送ajax异步请求】获取数据的表现,术语叫跨域
思考:如何解决跨域报错Access-Control-Allow-Origin,拿不到数据问题?
二、解决方法💡
前端👩🎓
1.前端代理 Http-proxy-middleware(最常用)
2.谷歌插件(开发过程用)
3.谷歌命令(最简单,直接把同源策略关闭)
如何配谷歌命令?
window环境下
1 找到谷歌浏览器安装目录或者直接用桌面的也行 发送桌面快捷方式
2 单击图标 鼠标右击 点击属性
3 在目标后面输入 下述代码
–disable-web-security --user-data-dir=C:\chromedata
“C:\Program Files\Google\Chrome\Application\chrome.exe” --disable-web-security --user-data-dir=C:\chromedata
没有引号无所谓,有引号在外面
切记加个空格
再去创建下磁盘目录C:\chromedata
4 点击确定 双击打开你配置的快捷方式 随意访问
mac环境下
sudo open -n /Applications/Google\ Chrome.app/ --args --disable-web-security --user-data-dir=/Users/用户名/自己随便搞一个目录/
sudo open -n /Applications/Google\ Chrome.app/ --args --disable-web-security --user-data-dir=/Users/wof/ab/
sudo open -n /Applications/Google\ Chrome.app/ --args --disable-web-security --user-data-dir=/Users/wof/MyChromeDevUserData/
4.前端jsonp(需要前后端配合 不推荐)
5.用websocket技术
6.用H5里的window.postMessage在两个网页间传递数据 (iframe嵌套网页)
后端&运维👨🎓
后端:cors方法 也就是后端声明header头允许跨域
运维:nginx反向代理