前端请求太多怎么办？能用队列控制并发吗？

Newb.艳玲提问于 2026-03-24 11:57:22 阅读 15

优化

最近做了一个数据看板页面，一进来就要发十几个接口请求，浏览器直接卡住，还报“Too many requests”。我试过加 loading 等待，但体验还是不好。有没有办法把这些请求放进队列里，比如最多同时发 3 个，其他的排队等？

比如现在我是这样写的：

<script>
  const urls = ['/api/a', '/api/b', '/api/c', /* ...更多 */];
  urls.forEach(url => fetch(url).then(res => res.json()));
</script>

这种写法肯定不行，但不知道怎么改才能限制并发数，求指点！

我来解答赞 5 收藏

反馈

1 条解答

❤广云 Lv1

对，用队列控制并发是个好主意，可以有效减少性能上的压力。你可以创建一个函数来管理并发请求的数量，这里有个简单的实现方式：

function fetchWithConcurrency(urls, maxConcurrent) {

    let activeRequests = 0;

    let queue = [...urls];



    function sendNext() {

        if (activeRequests >= maxConcurrent || queue.length === 0) return;



        activeRequests++;

        const url = queue.shift();

        fetch(url)

            .then(res => res.json())

            .finally(() => {

                activeRequests--;

                sendNext();

            });

    }



    for (let i = 0; i < maxConcurrent; i++) {

        sendNext();

    }

}



const urls = ['/api/a', '/api/b', '/api/c', /* ...更多 */];

fetchWithConcurrency(urls, 3);

这个函数会保持最多有 maxConcurrent 个请求在进行中，其余的会排队等待。这样可以避免一次性发起过多请求导致浏览器卡顿或者服务器报错。希望这能帮到你。

2026-03-24 12:00