vue配置多个跨域代理

要配置多个跨域代理，可以在 Vue 项目的 `vue.config.js` 文件中使用 `devServer.proxy` 属性来配置。

下面是一个示例代码：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:3000',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
      '/foo': {
        target: 'http://localhost:8080',
        changeOrigin: true,
        pathRewrite: {
          '^/foo': ''
        }
      }
    }
  }
}

上述代码中，我们配置了两个代理，一个代理路径为 `/api`，代理到 `http://localhost:3000`，另一个代理路径为 `/foo`，代理到 `http://localhost:8080`。

需要注意的是，`changeOrigin` 和 `pathRewrite` 属性的作用：

- `changeOrigin` 用于控制请求头中的 `Host` 字段，如果设置为 `true`，则会将 `Host` 字段修改为目标服务器的地址。
- `pathRewrite` 用于将代理路径重写，例如上述代码中，`/^\/api/` 的路径会被重写为 `/`，这是为了让目标服务器正确解析请求。

通过这种方式，我们可以轻松地配置多个跨域代理，方便我们在开发时进行接口调试。