跨域是什么：
跨域，是指浏览器不能执行其它网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript实施的安全限制。
简单来讲，就是从地址A加载的页面，不能访问地址B的服务（如上图）。此时地址A与地址B不同源。
所谓同源，就是域名、协议、端口均相同。举个例子：
http://www.123.com/index.html 调用 http://www.123.com/abc.do （非跨域）
http://www.123.com/index.html 调用 http://www.456.com/abc.do （主域名不同:123/456，跨域）
http://abc.123.com/index.html 调用 http://def.123.com/server.do （子域名不同:abc/def，跨域）
http://www.123.com:8080/index.html 调用 http://www.123.com:8081/server.do（端口不同:8080/8081，跨域）
http://www.123.com/index.html 调用 https://www.123.com/server.do （协议不同:http/https，跨域）
如上所述，由于合作方的域名与我方的域名不同，从合作方加载的页面，调用我方接口的时候，就会出现跨域的报错。
简单的来说：协议、IP、端口三者都相同，则为同源。不是同源的脚本不能操作其他源下面的对象。
解决方案
在前端设置proxy代理，来解决跨域问题。这边使用的是vue-cli3.0
在根目录的vue.config.js下加入如下配置:
module.exports = { devServer:{ proxy: { '/api': { target: 'http://47.114.73.36:8077', //API服务器的地址 ws: true, //代理websockets changeOrigin: true, // 虚拟的站点需要更管origin pathRewrite: { //重写路径 比如'/api/aaa/ccc'重写为'/aaa/ccc' '^/api': '' } } }, },}
我们仅需在axios的封装方案上，就可以对应上devServer设置的变量。示列：
axios .post( "/api"+"/tianbo/user/login", qs.stringify({ iphone: iphone, pwd: psd, }) ) .then((res) => { console.log(res); } });
设置完代理别忘了重启服务器。
好了，以上就是vue中配置代理解决跨域的问题。
如有问题，请指出，接受批评。
