vue-cli3.0 axios跨域请求代理配置及端口修改
1.安装 axios2. 在全局中main.js 中引入import axios from ‘axios’Vue.prototype.$axios = axios3.项目根目录下新建 vue.config.js//如果你用vue-cli初始化一个项目,一般proxyTable中是空的proxyTable:{}//在里面填入:proxyTable:{‘/api’: {tar...
·
1.安装 axios
2. 在全局中main.js 中引入
import axios from 'axios'
Vue.prototype.$axios = axios
3.项目根目录下新建 vue.config.js
//如果你用vue-cli初始化一个项目,一般proxyTable中是空的
proxyTable:{}
//在里面填入:
proxyTable:{
'/api': {
target: 'http://testapi.tvm.com.cn', //设置你调用的接口域名和端口号 别忘了加http
changeOrigin: true,
pathRewrite: {
'^/api': '', //这里理解成用'/api'代替target里面的地址,后面组件中我们掉接口时直接用api 代替 比如我要调用'http://xxx.xxx.xxx.xx:8081/user/add',直接写‘/api/user/add’即可
}
}
上面pathRewrite中的注释不清楚,我再写一遍:
用’/api’来代替target中的地址,以后再调用接口,比如http://testapi.tvm.com.cn/some/getsome
那么就直接写 ‘/api/some/getsome’
设置好之后,我们到一个组件中使用,上面已经引入了axios
let url='/api/some/getsome'
this.$axios.get(url).then(res=>{
console.log(res)
})
.catch(err=>{
console.log(err)
})
- 重启服务npm run dev
更多推荐
已为社区贡献12条内容
所有评论(0)