创建多个 axios 实例肯定是最愚蠢的解决方案 。 大佬们是怎么解决这个问题的
![]() | 1 learningman 2021-03-24 10:27:15 +08:00 via Android RTFM |
![]() | 2 66beta 2021-03-24 10:28:47 +08:00 看标题不知道你想要啥,多机房随机一个发送请求? |
3 cwz346852114 OP @66beta 动态配置 url 但是只创建一个 axios 实例 |
![]() | 4 akaxiaok339 2021-03-24 10:35:39 +08:00 baseURL 和 URL 还不够用吗 |
![]() | 5 qiayue PRO 建议把你最原始需求说出来,现在你说的是你为了解决最原始需求想到的一个解决方案,但很可能这不是最优方案 |
6 cwz346852114 OP @qiayue 后端之前一个项目拆成两个项目了 然后域名不一致 如果创建多个 axios 实例是能解决这个问题 拓展开来这个方案就有点问题 如果项目扩充请求多个 url 不可能一个 url 配置一个 axios 实例,所以 如果一个 axios 能解决 n 个域名的问题 |
7 cwz346852114 OP @akaxiaok339 不够用 |
8 zhlssg 2021-03-24 10:38:54 +08:00 如果是多个 baseUrl 的话,多实例,在后再原型对象上做拦截器处理就好了 不想多实例,那么就不要配置 baseUrl 属性,在每个请求里添加一个额外标识,然后用 transform,或者拦截器里,拿到标识后在各自添加前缀路径 |
![]() | 9 66beta 2021-03-24 10:42:18 +08:00 ![]() axios 实例一般都是一个,你调用的时候给的 url 不一样,跟后端有几个域名无关 |
![]() | 10 H15018327040 2021-03-24 10:43:07 +08:00 如何判断这个请求是要发往那个服务器的呢? |
![]() | 11 treblex 2021-03-24 10:44:06 +08:00 2 个实例没什么不好的,拦截器有通用的复用一下就行了 |
12 yeqizhang 2021-03-24 10:44:17 +08:00 我看我这边前端只用了一个, baseurl 然后拼接后端给的不一样的代理路径的..... 你搞几个不一样的 baseurl 来拼接不行吗? 难不成是想解决跨域? |
13 cwz346852114 OP @yeqizhang 是这样的 url 是前面的域名路径 比如我服务端 n 个项目部署在 n 个域名上 那么要请求 n 个域名 |
14 cwz346852114 OP @treblex 2 个实例是没问题 但是多了呢? |
![]() | 15 jiangshanmeta 2021-03-24 11:00:54 +08:00 后端两个服务 请求路径给不同前缀 /service1/api /service2/api 这样 然后请求就请求本域 召唤运维配转发 顺便还能解决跨域 |
![]() | 16 y4ZIZrCL74b9MYl6 2021-03-24 11:01:15 +08:00 不使用 baseURL 封装,每次调用都传入新的 url |
![]() | 17 Shook 2021-03-24 11:01:35 +08:00 1. 合并请求参数 2. 拦截器处理 3. proxy 处理 |
![]() | 18 H15018327040 2021-03-24 11:02:31 +08:00 let baseUrl="http://192.168.1.89:8080" export default { login(param) { return axiosInstance.post("/login",param,{ baseUrl:baseUrl }) } } 同一个域名的请求写在同一个 js 里面。 |
19 cwz346852114 OP @H15018327040 这个是一个解决方案 |
20 cwz346852114 OP @jiangshanmeta 小公司没运维 |
21 cwz346852114 OP @H15018327040 如果 url 多了 那你这个 js 文件也挺多的 |
22 cwz346852114 OP @Shook proxy 代理服务端无法使用 |
23 GzhiYi 2021-03-24 11:16:17 +08:00 一个实例可以扩展多个不同的请求方法 const ins = axios.create({}) const requestOne= (url, params, cOnfig= {}) => { return ins({ url: `${domain1}/url` }) } const requestTwo = (url, params, cOnfig= {}) => { return ins({ url: `${domain2}/url` }) } |
![]() | 24 treblex 2021-03-24 11:16:36 +08:00 |
![]() | 25 woodie1994 2021-03-24 11:17:14 +08:00 baseUrl 可以覆盖的,像这样 return request({ url: 'x'x'x', method: 'post', data, baseURL: 'https://xxx' }) |
26 codder 2021-03-24 11:23:24 +08:00 你将 axios 封装成一个类,不同的接口就生成不同的实例并传入对应的 baseURl 就好了啊! |
![]() | 27 H15018327040 2021-03-24 11:27:53 +08:00 @cwz346852114 也可以组成一个文件,只是一个域名一个文件好做管理,这种多域名也不至于多到十几个吧,如果真有十几个,就得考虑业务是不是有问题了。 |
28 cwz346852114 OP @H15018327040 前端做统一路径 后端做接口分发这个方案比较好一点吧 |
![]() | 29 H15018327040 2021-03-24 11:35:32 +08:00 前端:这个需求前端不好做,后端好做, 后端:这个需求后端不好做,前端好做,/狗头 |
![]() | 30 Shook 2021-03-24 11:36:30 +08:00 // types.js export const types = { --baidu: 'https://www.baidu.com/', --google: 'https://www.google.com/', }; // solution 1: import axios from 'axios'; import { types } from './types'; const useTypedHttp = (type, options) => axios.request({ --baseURL: types[type] ?? type, --...options, }); // solution 2: import axios from 'axios'; import { types } from './types'; axios.interceptors.request.use(cOnfig=> { --const optiOns= { { /* default option properties */ }, ...config.options }; --if (options.type && types[options.type]) { ----config.baseURL = types[options.type]; --} --return config; }); 还可以自己写替换前缀啥的,方法好多的。 |
![]() | 31 Vegetable 2021-03-24 11:40:18 +08:00 创建多个实例,对小公司来说可能是最好的解决方案。 |
32 lliu3 2021-03-24 17:04:36 +08:00 baseUrl 通过 store 动态获取 |