">
您的位置:首页 > 技术中心 > 前端框架 >

javaScript高并发请求,可控制请求次数,js并发请求

时间:2022-11-06 12:33

javaScript完成高并发请求 Html部代码

<!DOCTYPE html>
<html>
<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>
    <h1>并发请求</h1>
    <script src="./index.js"></script>
    <script>
        const urls = [];
        for(let i=1;i<=100;i++){
            urls.push(`https://api.uixsj.cn/hitokoto/get?tyoe=social/${i}`)
        }
        concurRequest(urls,20).then(ret=>{
            console.log(ret);
        })
    </script>
</body>
</html>

javaScript完成高并发请求 javaScrip部代码

/**
 * 并发请求
 * @param {string[]} urls 待请求的url数组
 * @param {number} maxNum 最大的并发数
 */
function concurRequest(urls, maxNum) {
    return new Promise(resolve => {
        if (urls.length === 0) {
            /* 先考虑边界问题 */
            resolve([]);
            return;
        }
        const results = [] //存储请求结果并返回
        let index = 0; //下一个请求的url下标
        let count = 0; //计算请求的数量

        async function request() {
            if (index === urls.length) {
                return;
            }
            const i = index;
            const url = urls[index];
            index++
            try {
                // let ret = await (await fetch(url)).text();
                let ret = await fetch(url);
                results[i] = ret //不能用push,因为这样就会出现异步完成优先写入不符合要求。
            } catch (error) {
                results[i] = err
            } finally {
                count++
                if (count === urls.length) {
                    resolve(results);
                }
                request();
            }

            // console.log(ret);
            // console.log(url);
            console.log(results);
        }
        
        const times = Math.min(maxNum,urls.length);
        for(let i=0;i<times;i++){
            request();
        }
        
    })
}


本类排行

今日推荐

热门手游