vue如何配置多条代理

在 Vue 中配置多条代理可以通过在 `vue.config.js` 文件中设置 `proxy` 选项来实现。`proxy` 是一个对象，其中的每个属性都代表一条代理规则。例如，假设我们需要将 `/api` 下的请求代理到不同的后端服务器上，可以这样配置：

module.exports = {
  devServer: {
    proxy: {
      '/api/foo': {
        target: 'http://backend1.example.com',
        changeOrigin: true
      },
      '/api/bar': {
        target: 'http://backend2.example.com',
        changeOrigin: true
      }
    }
  }
}

上面的配置中，`/api/foo` 下的请求将被代理到 `http://backend1.example.com`，而 `/api/bar` 下的请求将被代理到 `http://backend2.example.com`。

其中，`target` 表示要代理到的后端服务器地址，`changeOrigin` 表示是否改变请求头中的 Origin 字段值。如果后端服务器需要验证 Origin 字段，可以将 `changeOrigin` 设置为 true，这样请求头中的 Origin 字段就会被设置为代理服务器的地址。

需要注意的是，当使用多条代理规则时，如果请求的 URL 地址匹配多个规则，则只会使用第一个匹配的规则。因此，在设置多条代理规则时需要注意规则的顺序。