vue中axios跨域的处理（以修改webpack配置文件的方式）

在前端开发过程中会遇到跨域问题，在vue中以axios的方式来处理跨域，我们用到的是webpack修改配置文件的方式。主要实在proxyTable这个对象中做一些相关的配置。

1.修改config文件夹下面的index.js文件，在dev的大括号里面添加如下代码

proxyTable: {
 //自己起个名字 到时候在axios里面引入这个名字 这个名字就代表下面的那个路径/mock/vuetesterver/
 '/testUrl': {
 target: "http://mock.test.cn", //跨域服务器的域名
 changeOrigin: true,
 pathRewrite: {
 '^/testUrl': '/mock/vuetestserver/' //跨域服务器地址的路径部分,可以不写最后一个路径部分,到时候axios动态拼接最后路径
 }
 },
},

2：在项目中axios请求代码如下

this.$axios({
//testUrl 就表示 index.js 文件中声明代表的那个路径，再动态拼接最后一个,实际的server路径就可以了
 url:"/testUrl/myserver.test"
 }).then(res=>{
 console.log(res.data);
})
.catch(err=>{
 
})

3：最终跨域服务器的真实路径

http://mock.test.cn/mock/vuetestserver/myserver.test

4.跨域配置成功