随笔-vue项目config/index.js中proxyTable用法

随笔-vue项目config/index.js中proxyTable用法

---

本文参考链接:
看视频学习Vue,引入axios进行Ajax请求,但是感觉请求URL太长,于是网上找到了proxyTable:

1. vsCode快捷键 Ctrl + P 搜索 config/index.js,找到:

module.exports={
  dev：{
      proxyTable:{}
  }
}

2. 将proxyTable更改为:

proxyTable: {
 "/api": {
    target: "http://www.liulongbin.top:3005/api", //设置调用的接口域名和端口
    changeOrigin: true,	//是否跨域
    pathRewrite: {
      "^/api": "" //用'/api' 代替 'http://www.liulongbin.top:3005/api'
    }
  }
},

3. 使用axios调用示例:

getlunbo() {
    let _this = this;
    _this.$axios.get('/api/getlunbo').then(function(result){
        console.log(result)
    })
}

在浏览器中看到的访问地址:

其实真正访问的地址是: http://www.liulongbin.top:3005/api/getlunbo

• 若文中有错误,欢迎指教.

• END