vue.config.js 配置代理

// vue.config.js

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:4000', // 目标API服务器的地址
        changeOrigin: true, // 是否改变请求的origin，默认为false，设置为true时会自动更改请求头中的host为target的地址
        pathRewrite: { // 路径重写规则
          '^/api': '' // 将 /api 前缀替换为空字符串，使请求路径变为 http://localhost:4000/xxx
        }
      }
    }
  }
}

解释说明：

1. devServer.proxy：用于配置开发服务器的代理，解决开发环境下的跨域问题。
2. target：指定目标API服务器的地址。例如，如果你的后端服务运行在 http://localhost:4000，那么所有的 /api 请求都会被代理到这个地址。
3. changeOrigin：当设置为 true 时，会修改请求头中的 Host 字段为目标服务器的地址，这在某些情况下是必需的。
4. pathRewrite：用于重写请求路径。例如，将 /api 前缀去掉，使得请求路径从 /api/users 变为 /users，从而匹配目标服务器的实际API路径。

这样配置后，当你在前端发送请求到 /api/users，实际请求会被代理到 http://localhost:4000/users。