循环中有多个AJAX调用

时间:2016-04-18 12:12:27

标签: javascript jquery angularjs ajax

我需要一种在Javascript / Angular中同时发送多个AJAX调用的方法。 经过一番搜索,我无法找到答案。 我想要做的是尽快发送我的所有请求。 如果我使用Angular中的$ q库在for循环或promises队列中执行我的调用,则会发送一个请求,等待它执行回调,然后发送下一个。 这是一个示例代码:

var array = [];
    Page.get({id:1}, function(result){
        for(var i = 0; i < result.region[0].hotspots.length; i++){
            var promise = Hotspot.get({id: result.region[0].hotspots[i].id});
            array.push(promise);
        }
        $q.all(array).then(function(data){
            console.log(data);
        });
    });

Page是一个角度资源,其get方法需要ID。

我想要的是他们都会在同一时间被发送,他们在准备好时会拨回电话。回复调用的顺序并不重要。

由于

3 个答案:

答案 0 :(得分:1)

使用Web Workers

开箱即用

解决此问题的一个有趣方法是使用网络工作者不同的帖子中执行请求。如果您不熟悉网络工作者,我建议您从great tutorialtechsith开始。基本上,您将能够同时执行多个作业。另请参阅W3Schools Documentation

enter image description here

来自articleHtml5Rocks教会我们如何在没有单独的脚本文件的情况下使用Web Workers。

答案 1 :(得分:0)

您是否尝试过使用Async.js模块?

您可以使用

之类的内容实现所需的行为
Page.get({id:1}, function(result){
    async.each(result.region[0].hotspots, callAsync, function(err, res){
        console.log(res);
    }
});

function callAsync(hotspot, callback){
    callback(null, Hotspot.get({id: hotspot.id});
}

来自Doc:

  

每个(coll,iteratee,[callback])

     

将函数iteratee并行应用于coll中的每个项目。该   使用列表中的项目调用iteratee,并使用when的回调   它已经完成了。如果iteratee将错误传递给它的回调,那么   主要回调(对于每个函数)立即调用   错误。

答案 2 :(得分:0)

$http服务并行发送XHR。下面的代码演示了10个XHR被发送到httpbin.org,然后以不同的顺序接收。

angular.module('myApp').controller('myVm', function ($scope, $http) {
    var vm = $scope;
    vm.sentList = [];
    vm.rcvList = [];
    //XHR with delay from 9 to 1 seconds
    for (var n=9; n>0; n--) {
        var url = "https://httpbin.org/delay/" + n;
        vm.sentList.push(url);
        $http.get(url).then(function (response) {
             vm.rcvList.push(response.data.url);
        });
    };
    //XHR with 3 second delay
    var url = "https://httpbin.org/delay/3";
    vm.sentList.push(url);
    $http.get(url).then(function (response) {
         vm.rcvList.push(response.data.url);
    })
})

DEMO on JSFiddle