Vue-cli proxyTable 解决开发环境的跨域

基于Vue开发项目时我们会遇到了跨域问题,vue-cli的config文件里有一个参数叫proxyTable,这个参数就是用来处理跨域问题的。
有关于API proxy的说明,使用的就是这个参数。
这个参数主要是一个地址映射表,你可以通过设置将复杂的url简化,例如我们要请求的地址是http://127.0.0.1:4000/list/home,可以按照如下设置:
config-->index.js

proxyTable: {
      '/list': {
        target: 'http://127.0.0.1:4000',
        changeOrigin: true, //解决跨域问题
        pathRewrite: {
          '^/list': '/list'
        }
      }
    }

简易后台

let express = require('express')
let app = express()
app.get('/list/home', function (req, res) {
  res.send('hello world');
});
app.listen('4000', () => {
  console.log('part 4000 start')
})

api-->index.js

import axios from 'axios'
export default {
  home: {
    getHome: function () {
      return axios.get('list/home')
    }
  }
}

components-->hello.vue





你可能感兴趣的:(Vue-cli proxyTable 解决开发环境的跨域)