jQuery请求一个url列表，同时限制最大并发请求数[重复]

Question

可能重复：
Queue AJAX calls

我有一个 id 列表：

var ids = [3738, 75995, 927, ... ]; // length is about 2000

我想用$.getJSON请求网址http://xx/ + id，比如：

ids.forEach(function(id, index){
    $.getJSON('http://xx/' + id, function(data){
        // store the data in another array.
    });
});

但是这样会一次性发出过多的请求，让浏览器阻塞一段时间，所以我的问题是，如何限制jQuery中的并发ajax请求数？例如，我发送了 10 个请求，当每个请求得到响应时，我发送另一个请求。

Answer 1

shift() 或 pop() 在您启动请求时从数组中删除 id。首先发出 10 个请求。然后在您的 ajax 调用的 complete() 处理程序中，检查数组长度。如果大于 0，setTimeout 持续几百毫秒（以释放浏览器一点），然后移动或弹出另一个 ID 并触发另一个请求。

Answer 2

var $queue = $({});

ids.forEach(function(id, index) {
    $queue.queue("ajaxQueue", function( next ) {
        $.getJSON('http://xx/' + id, function(data){
            // store the data in another array.

            next();
        });
    });
});

$queue.queue("ajaxQueue", function() {
    // everything is saved
});

$queue.dequeue("ajaxQueue");

---

jQuery 文档：

jQuery.queue
jQuery.dequeue

所以：

What are queues in jQuery?

---

还有：

解决方案应该是如何让后端处理多个 id。 – epascarello

---

##当时的十个请求：有一些问题！

var $queue = $({}),
    handler;

ids.forEach(function(id, index) {
    if ( !(index % 10) && handler ) {
         $queue.queue("ajaxQueue", handler);
    }
    handler = (function(prev) {
        return function( next ) {
            prev();
            $.getJSON('http://xx/' + id, function(data){
                // store the data in another array.
            });
            if ( next ) {
                next();
            }
        }
    })(handler);
});

$queue.queue("ajaxQueue", function() {
    // everything is saved
});

$queue.dequeue("ajaxQueue");

x % y

(index % 10) => Math.floor(index/10)*10 === index;
!(index % 10) => Math.floor(index/10)*10 !== index;

Answer 3

这应该可以解决问题：

var current;    

function fetchCurrentLast()
{
    if (current < ids.length)
    {
        var id = ids[current];
        current++;

        $.getJSON('http://xx/' + id, function(data){
            // store the data in another array.

            fetchCurrentLast();
        });
    }
}

current = 0;

for (var i = 0; i < 10; i++)
{
    fetchCurrentLast();
}

Answer 4

var cnt = 0;
function getEach() {
    if (cnt>=ids.length) return;
    $.getJSON('http://xx/' + ids[cnt], function(data){
    // store the data in another array.
    cnt++;
    getEach(); 
    // or setTimeout(getEach,1000); to wait a sec
    // or if (cnt%10==0) setTimeout(getEach,1000); to wait a sec every 10
    //    else getEach();
  });
}