在使用vue开发时，后端和本地不在同一域中，导致无法访问api
只需要在vue.config.js中配置devServer下的proxy即可。

配置vue.config.js

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  // ...
  devServer: {
    proxy: {
        // 所有请求是/api开始的都会被匹配 如:http://xxx.com/api/init
      '/api': {
        target:'http://127.0.0.1:81', // 后端服务器地址
        ws: true,
        changeOrigin: true,
        pathRewrite : {
          '^/api/' : '/' ,  // 重写路径 将请求 xxx.com/api/init 转成xxx.com/init
        } ,
      },
        // 如果是图片地址也可以搞
      '/upload':{
        target:'http://127.0.0.1:81',
      }
    },
    client:{
      overlay:false
    }
  },
  pages:{
    index:{
      entry:'src/main.js',
      title:'xxx管理系统'
    }
  },
  assetsDir: 'static'
  // ...
})

axios配置

let config = {
  // 使用env配置 开发环境和生成环境
  baseURL: process.env.VUE_APP_URL,
  timeout: 10 * 1000, // Timeout
  // withCredentials: true, // Check cross-site Access-Control
};
const _axios = axios.create(config);

Env配置

我们需要配置两个.env文件，在根目录下
1.开发环境的 .env.development

VUE_APP_URL = "/api/"

2.生产环境的 .env

VUE_APP_URL = "/"