vue正式环境如何能配置多个请求的url？-灵析社区
ciiiiinemavue项目 打包放到服务器上之后 如何能做到 模块1 请求www.xxx1.com的接口，模块2请求www.xxx2.com的接口.... .. 这种能实现吗？需要怎么配置 动态配置
代码剑客行想了两个方案，一个是axios创建实例的时候就不同前缀，一个是加入拦截器改写配置。
从长远来说，还是分开比较好。
const axiosInstanceForXXX1 = axios.create({
baseURL: 'http://localhost:8001/api/',
timeout: 5000,
});
const axiosInstanceForXXX2 = axios.create({
baseURL: 'http://localhost:8002/api/',
timeout: 5000,
});
const response = await axiosInstanceForXXX1.get('/path');
const response2 = await axiosInstanceForXXX2.get('/path');
方案2
instance.interceptors.request.use(
(config) => {
let { url } = config;
// 如果 URL 以 '/module-a' 开头，则修改 baseURL
if (url && url.startsWith('/module-a')) {
config.baseURL = 'https://module-a-api.example.com/';
}
if (url && url.startsWith('/module-b')) {
config.baseURL = 'https://module-b-api.example.com/';
}
url = url.replace('/module-a/','/')
config.url = url.replace('/module-b/','/')
return config;
},
(error) => {
// 处理请求错误
return Promise.reject(error);
}
);
调用
import api from "./utils/axios.ts";
api.get('/module-a/xx')
api.get('/module-b/xx')
ps 注意代码健壮性，我就演示一下思路