vuecli3 配置代理解决axios请求后台接口跨域问题

项目根目录下新建vue.config.js。

const targetUrl = 'http://1.1.1.2:2222'

module.exports = {
  devServer: {                //记住，别写错了devServer
    host: 'localhost',        //设置本地服务器   选填
    port: 8080,				//设置本地默认端口  选填
    proxy: {                 //设置代理，必须填
      '/api': {              //设置拦截器  拦截器格式   斜杠+拦截器名字，名字可以自己定
        target: targetUrl,     //代理的目标地址
        changeOrigin: true,              //是否设置同源，输入是的
        pathRewrite: {                   //路径重写
          '/api': ''                     //选择忽略拦截器里面的单词
        }
      }
    }
  }
}

axios的baseURL不需要配置。

const http = axios.create({})

请求后台接口：

    // 测试post接口
    let params = { name: 'admin' }
    this.$http.post("/api/test", params)

这里就相当于请求  http://1.1.1.2:2222/test