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

  • 2021-08-16 22:58:01
  • OfStack

If the interface is tuned with different backend, if the backend interface is not combined with one, the front end can be equipped with different agents to access their interfaces together

Set the following in index. js under the config folder:


proxyTable: {
  '/api/login': { //  No. 1 1 Agents: The path here is the same part in front of all interfaces, which is used to match the with this part of the path 
    target: "http://192.168.100.209:8910",
    changeOrigin: true,
    secure: false
  },
  '/api/supplier': { //  Set the 2 Agents 
    target: "http://192.168.101.26:8910",
    changeOrigin: true,
    secure: false
  },
}

Supplementary knowledge: Realize joint debugging with multiple backgrounds under vue project development environment

Set the 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 ,
        }
      }
    },

In this way, you can make joint debugging according to different backgrounds


Related articles: