vue 配置代理方式二(可以实现多代理)

axios.get("https://api.github.com/search/users?q=a").then(
        (response) => {
          console.log("get请求成功", response.data);
        },
        (error) => {
          console.log("请求失败", error.message);
        }
      );

总结：

 

devServer: {
    proxy: {
      '/api': {
        target: '<url>',
        pathRewrite{'^/api':''},
        ws: true,
        changeOrigin: true
      },
    }
  }

 _____________________________________________________________________________

devServer: {
    proxy: {
      '/api': {
        target: '<url>',
        pathRewrite{'^/api':''},
        ws: true,
        changeOrigin: true
      },
    }
  }

如下下面这么配置

 

会发现报错,而这不是跨域的问题,而是如果你直接这么写,就相当于要在5000服务器上找atguigu/students，而5000服务器中根本没有所以报错

 

所以需要给5000服务器时,不能带着/atguigu 所以用一个配置项pathRewrite:{'^/atguigu':''} 意思为把atguigu开头的把atguigu替换成‘’空,就可以实现传送路径时,把atguigu去掉 

 

 然后后面两个配置项ws是用于支持websocket

changeOrigin 为false就是5000端口服务器问代理服务器是上面端口号,8080代理服务器如实回答为8080

但是为true就是回答5000

当把它们注释掉了的话,默认为true

 

获取多个端口服务器的数据

因为加了代理前缀所以就会走代理,