需求: 现在有一组请求,想让其依次每次执行一定的请求数量并发请求,直到请求到最后一个请求,直至完成所有请求,而且要求请求返回的结果顺序和请求时的顺序保持一致。
代码实现:
// maxNum 最大并发请求数(fetch采用Promise方式来处理数据,比XMLHttpRequest更加简单易用)
function concurRequest(urls, maxNum) {
return new Promise((resolve) => {
if (urls.length === 0) {
resolve([])
return;
}
const results = []
let index = 0 // 下一个请求的下标
let count = 0 // 当前请求完成的数量
// 发送请求
async function request() {
if (index === urls.length) {
return
}
const i = index;
const url = urls[index]
index++
try {
const resp = await fetch(url)
// 将resp加入到results
results[i] = resp
} catch (error) {
// 将error加入到results
results[i] = error
} finally {
// 判断是否所有的请求都已经完成
count++
if (count === urls.length) {
resolve(results)
}
request()
}
}
// 取最大并发数和请求url数组长度两者中最小的值作为并发请求数
const times = Math.min(maxNum, urls.length)
for (let i = 0; i < times; i++) {
request()
}
})
}
// 并发请求调用示例
const urls = []
for (let i = 0; i < 100; i++) {
urls.push('https://www.csdn.net/')
}
// 并发请求数为3
concurRequest(urls, 3).then((resp) => {
console.log(resp);
})