前言
最近的两次开发在试用axios时被这个问题所困扰,网上也有很多层出不穷的回复,包括知乎上也有,所以我就来做个小结。
1.Jsonp
可以引入vue-resource,然后使用
或者是原生JS设置type为jsonp
2.插件:http-proxy-middleware
https://github.com/chimurai/http-proxy-middleware
2.1 vue-cli的配置(用到的也是http-proxy-middleware)
如果是vue-cli搭建的项目,在config下有个index.js文件,然后有一个proxyTable的参数,可以进行以下两种配置方式,原来的服务器是localhost:4567,需要配置的是localhost:8089
vue-cli-001
3.Nginx
配置代理服务器。
或者修改header
nginx跨域解决方案配置
4.服务器端配置
可以在API上配置以下配置,意思是所有的url都可以访问,缺点是安全性不高。
responce.header("Access-Control-Allow-Origin","*");
5.[CORS](https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS)
小结
总的来说解决跨域问题最优的解决方案是通过配置代理服务器,将url转成想要的服务器的URL。