webpack搭建的vue项目如何利用axios代理跨域
2019-05-13 本文已影响0人
AizawaSayo
1.找到config文件夹下的index.js,找到proxyTable: {},在里面填入
proxyTable: {//axios跨域处理
"/api":{
target: ' http://v.juhe.cn',//要跨域访问的域名或ip+端口号地址
//secure: false, //如果是https接口,需要配置这个参数
changeOrigin: true,
pathRewrite:{
'^/api':''
}
}
}
2.接下来在src文件夹下的入口文件main.js里配置
Vue.config.productionTip = false
//配置公共URL
//Axios.defaults.baseURL='http://v.juhe.cn'
Axios.defaults.baseURL='/api'
//配置axios
Vue.prototype.$axios=Axios;
3.最后去请求访问接口的地方和我们通常做的那样加上接口名即可,注意:接口名必须要写相对路径,如 /xxx?id=1
this.$axios.get('/toutiao/index?type=top')
.then(res=>{
console.log(res);
})
.catch(err=>{
console.log('轮播图数据异常',err)
})