请问前端 axios 1s 内有多个请求,前两个立即执行,后面的延迟 0.5s,然后后面的重复前面的判断,请问怎么写呢

2021-06-03 10:31:23 +08:00
 shilianmlxg

这个把我给整崩溃了,

后端接口是做了限制的,防止爬虫。1s 内访问超过 3 个接口,后面的都会强制终止请求。 我前端要怎么写才能满足我上面所说的呢

2534 次点击
所在节点    Vue.js
13 条回复
seki
2021-06-03 10:35:04 +08:00
shilianmlxg
2021-06-03 10:45:16 +08:00
谢谢大佬。大佬硬邦邦
yiranHZT
2021-06-03 11:05:29 +08:00
// PS: 没太看懂“然后后面的重复前面的判断”这句话的具体需求是什么

function sendRequests() {
const r1 = request1();
const r2 = request2();

setTimeout(async () => {
const r3 = request3();
const [result1, result2, result3] = await Promise.all([r1, r2, r3]);

// 处理返回结果的示例
if (result1 && result2 && result3) {
const result4 = await request4();
// Do something
// ...
} else {
// 如果请求结果不符合预期,则过段时间再试一次
setTimeout(sendRequests, 1000);
}
}, 500);
}
galikeoy
2021-06-03 11:07:04 +08:00
节流防抖
lodash.js _.throttle and _.debounce
zhw2590582
2021-06-03 11:08:22 +08:00
wunonglin
2021-06-03 11:08:35 +08:00
rxjs 完美解决你的需求
Vegetable
2021-06-03 11:10:34 +08:00
我从未见过反爬虫以秒为时间粒度限流的。

你可以简单的做一个限流,不是什么前两个立即执行,后边 0.5,而是实现和后端同样的逻辑。
IvanLi127
2021-06-03 12:24:13 +08:00
我觉得你得叫后端给你把接口整合了
otakustay
2021-06-03 14:03:36 +08:00
建队列吧,每次消费队列至少间隔 0.5s ,图简单就是 0.5s 的 setInverval 去队列里找有没有东西,有就消费
shilianmlxg
2021-06-03 15:57:18 +08:00
要求的是 发送请求 想的是都每个都会得到响应数据的,所以不能终止。
我也觉得不会写,想的是只能在 axios 的请求 request.js 里面写
shilianmlxg
2021-06-03 15:59:45 +08:00
@yiranHZT 谢谢大佬,但是想的是怎么写到 axios 的全局配置,就是防止请求过快,但是最好的理想状态是如果第一秒内有 4 个请求,那么第一秒里的前两个立即执行,后面的 2 个延迟一定时间执行。如果第二秒内还有 5 个请求,那么让下一秒内最多立即执行 2 个请求,剩下的延迟执行
shilianmlxg
2021-06-03 16:00:17 +08:00
@wunonglin 谢谢大佬指了条明路
shilianmlxg
2021-06-03 16:00:33 +08:00
@zhw2590582 谢谢大佬,大佬硬邦邦

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/781057

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX