JavaScript，AngularJS - 发送多个同时 ajax 调用答案

【问题标题】：JavaScript, AngularJS - sending multiple simultaneous ajax callsJavaScript，AngularJS - 发送多个同时 ajax 调用
【发布时间】：2017-01-27 06:00:42
【问题描述】：

在我的AngularJS 应用程序中，我有一个参数数组（例如一些ID），它们应该用作ajax 调用队列的参数。问题是该数组可能包含 600 多个项目，如果我只是使用 forEach 循环递归地进行 ajax 调用，浏览器页面最终会在每个请求得到解决之前停止响应，因为每个响应都会更新视图。是否有一种技术可以允许发送 ajax 请求，例如，一次异步发送 5 个请求，并且只有在这些请求完成后，才继续下一个 5 个请求？

【问题讨论】：

您需要在全部完成后还是在每个完成后更新视图？ Promise.all ??
@IlyaNovojilov - 或第三个选项，在每个“批次”5 个完成后
等等，你打算发送 600 个请求？
是的，有很多信息要显示在屏幕上，我有一个“全部显示”功能，总的来说需要 600 多个请求。
你永远不应该那样做。要么更改您的 API 以回答每个请求的多个查询，要么至少使用延迟加载来仅请求用户当前正在查看的信息。一次发送 600 个请求是不行的。

标签： javascript angularjs ajax promise es6-promise

【解决方案1】：

我认为最好的解决方案是更改端点以允许 Id 数组，但我想这不是一个选项。您可以使用 Promise 来限制同时请求的数量：

function chunkedAjax(idArray, index, limit) {
  if(index >= idArray.length) {
    return;
  }
  var index = index || 0;
  var limit = limit || 5;

  var chunk = idArray.slice(index, limit);
  var promises = [];

  angular.forEach(chunk, function(id) {
    var deferred = $q.defer();
    promises.push(deferred.promise);
    makeAjaxCall(id).then(function(response){
      deferred.resolve();
    });
  });

  $q.all(promises).then(function() {
    chukedAjax(idArray, index + limit, limit);
  });

}

这是一个递归函数，因此请注意。我会在投入生产之前大量调试。

您可能还需要修改您的 makeAjaxCall 函数以返回一个 Promise（如果它尚未返回），或者将 Promise 对象传递给它，以便在 ajax 调用完成时解决它

【讨论】：

【解决方案2】：

看看$q.all()。如果多个请求已完成，这使您可以执行回调。因此，您可以递归地执行有限数量的请求，直到处理完所有项目。

【讨论】：

重新阅读问题 - OP 希望限制活动请求的数量
你是对的。但我的想法是对 600 个请求进行分区并使用一些递归，如果调用成功回调，则会触发下一个 n 请求。
似乎是“答案：缺少此信息
也缺少例子

【解决方案3】：

是的！

看看这个模块：https://github.com/caolan/async

【讨论】：