【vue】前端调取多个后端服务器地址获取数据

项目场景：

今天收到这么一个需求，需要我去请求不同的服务器来获取数据，在网上搜了相关的方法，感觉都太复杂，我用下边这个方案也可以解决，并且暂时还没遇到坑，如果遇到坑会及时更新。

---

解决方案：

其实思路很简单，通过请求拦截器来判断路由，根据不同的路由去请求不同的后台地址

import axios from "axios";

const server = axios.create({
  baseURL: "http://192.168.x.xxx:8080",
});

server.interceptors.request.use(
  (config) => {
    // 拿到路由
    let type = config.url.split("/")[1];

    // 根据路由判断,后台地址是哪个
    switch (type) {
      case "item":
        config.baseURL = "http://192.168.x.xxx:8080";
        break;
      case "item1":
        config.baseURL = "http://192.168.x.xxx:8081";
        break;
    }

    const apiToken = localStorage.getItem("apiToken");
    if (apiToken) {
      config.headers.apiToken = apiToken;
    }
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

export default server;