js 实现并发请求*
在现代 Web 开发中,高效处理多个异步请求是一个常见需求。并发请求允许同时处理多个请求,可以显著提高 Web 应用程序的性能,也是高频面试之一,一下代码当前一个请求完成时,再发送下一个请求(以下代码未用队列实现)
q群 306671879 群里面有免费资料纯免费,大家一起学习,如果自己有什么好的学习资料也可以一起分享,一个人的力量终究有限,共同进步。
// test.js
function concurRequest(urls, maxNum) {
return new Promise((resolve, reject) => {
if (urls.length === 0) {
resolve([]);
return;
}
const result = []; // 用来返回的数组
let index = 0; // 下一个请求的下标
let count = 0;
// 发送请求
async function request() {
if (index === urls.length) {
return;
}
const i = index;
const url = urls[index];
index++;
// console.log(url);
// 不管成功失败都要push 到数组里面去
try {
const resp = await fetch(url);
result[i] = resp;
} catch (err) {
result[i] = err;
} finally {
// finally 不管请求成功或者失败都会进入这个里面
count++;
if (count === urls.length) {
// console.log('over');
resolve(result);
// return;
}
// request();
}
}
const time = Math.min(maxNum, urls.length);
for (let i = 0; i < time; i++) {
request();
}
});
}
这里是html部分
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document </title>
</head>
<body>
<div id="app"></div>
<script src="./test.js"></script>
<script>
const urls = []
for (let i = 0; i < 100; i++) {
urls.push(`https://xxxx.com/todps/${i}`);
}
// 每次处理三个
concurRequest(urls, 3).then(resps => {
console.log('resps', resps);
})
</script>
</body>
</html>