SoFunction
Updated on 2025-04-05

Configure different agents in vue to access different background operations at the same time

If the interface is adjusted with different background, if the background interface is not combined, the front-end can use different proxy to access their interfaces together

Set it in the config folder as follows:

proxyTable: {
  '/api/login': { // The first proxy: The path here is the same part before all interfaces, used to match the path with this part    target: "http://192.168.100.209:8910",
    changeOrigin: true,
    secure: false
  },
  '/api/supplier': { // Set up a second proxy    target: "http://192.168.101.26:8910",
    changeOrigin: true,
    secure: false
  },
}

Supplementary knowledge:In the vue project development environment, we realize joint communication with multiple backends.

Set up reverse proxy where you configure the development environment to set the reverse proxy

 proxyTable: {
      '/jk': {
        target: 'http://10.200.101.121:8090/',
        //target: 'http://118.24.184.180:8080/',
        changeOrigin: true,
        pathRewrite: {
          '^/api': '/api', //Rewrite,        }
      },
      '/wxapi': {
        target: 'http://10.200.102.141:8089',
        changeOrigin: true,
        pathRewrite: {
          '^/wxapi': '/wxapi', //Rewrite,        }
      },
      '/wxttxx': {
        target: 'http://10.200.102.141:8089',
        changeOrigin: true,
        pathRewrite: {
          '^/wxttxx': '/wxttxx', //Rewrite,        }
      }
    },

This allows for joint communication based on different backgrounds

The above article configuring different agents in vue to access different background operations at the same time is all the content I share with you. I hope you can give you a reference and I hope you can support me more.