[vue-cli3.0 + axios]跨域请求代理

1、配置vue.config.js

vue.config.js文件

说明：

a、'/api'：匹配项，匹配拦截；

b、target：被请求的地址，需要被代理的地址；

c、pathRewrite：重写配置，被代理的接口会多一个‘/api’的前缀，而原本的接口是没有的，所以需要通过此项来将接口的前缀‘/api’转换为‘’，如果原本接口就有‘/api’这种前缀，就可以把此项删掉；

d、changeOrigin：是否跨域。

2、配置axios.js

axios.js文件

a、baseURL：是axios请求拦截的默认地址，此处‘/api/’就是问题1的匹配项。

3、axios请求：

axios请求

a、'/MQSP/MainServlet'：请求接口“IP:端口”后的部分，因为在问题2中已经对axios.js进行了全局设置，所以此处不需要添加问题1中提到的配置项‘/api’前缀，如果没有进行全局配置此处应该写为‘/api/MQSP/MainServlet’。

4、请求效果：

代理前

代理后

5、跨域问题常见报错：

跨域问题常见报错