Ant Design vue 如何连接两个后端?

项目需求使用两个后端,现在已经连接上了一个,第二个不会弄了
我是在Ant Design vue 框架目录下:vue.config.js文件进行配置的,第一个后端(/api)已经链接成功

devServer: {
    // development server port 8000
    port: 8090,
    proxy: {
       '/api': {
         target: 'http://127.0.0.1:8001',
         ws: false,
         changeOrigin: true,
         pathRewrite: {
          '^/api': ''
        }
       },
     }
  },

前端通过axios向后端传递数据的url如下,而后端是api/all/,前端自动加上了api/

axios({
        url: 'all/',
        method: 'post',
        data: {  },
      }).then((res) => {
        console.log(res, 'res ');
      })

第二个后端使用同样的方式无法成功,会自动加上api/,而不是dcf

  devServer: {
    // development server port 8000
    port: 8090,
  
    proxy: {
       '/api': {
         target: 'http://127.0.0.1:8002',
         ws: false,
         changeOrigin: true,
         pathRewrite: {
          '^/api': ''
        }
       },
       '/dcf': {
        target: 'http://127.0.0.1:8001',
        ws: false,
        changeOrigin: true,
        pathRewrite: {
          '^/dcf': ''
        }
      }
     }
  },

此问题已解决,参考: https://blog.csdn.net/snow_living/article/details/127373042


proxy: {
       '/api': {
         target: 'http://127.0.0.1:8002',
         ws: false,
         changeOrigin: true,
       },
       '/dcf': {
        target: 'http://127.0.0.1:8001',
        ws: false,
        changeOrigin: true,
      }
     }

这样就行了吧,不过这样可能需要你在请求时加上/api/all ,而不是all, 可参考

img


不加前缀,肯定永远匹配第一个