Question

我在Web应用程序的Map上实现了“Spatial Selection”，它选择了Streets的数量。在选择之后，我获得了使用“选择处理程序”选择的所有街道的唯一街道ID。

我的下一步是向每个街道ID的服务器发送Ajax请求并获取响应。目前，我正在使用单个For循环并为每个街道ID发送Ajax请求，如下所示。

for (var index in streetIds) {
    sendAjaxRequest(streetIds[index]);
}

function sendAjaxRequest(streetId) {
  $.ajax({
      type : 'POST',
      url :  OpenLayers.ProxyHost + this.url,
      data : streetId,
      success : function(response) {
          sos.parseSOSObservations(response);
      },
      error : function(x, e) {
          alert("Something went wrong in the request" + e);
      }
  });
}

例如：如果用户在地图上选择了1000条街道，那么我的程序将发送1000个帖子请求，这显然会减慢我的应用程序并阻止浏览器。

任何人都可以建议，在这种情况下，如何考虑Web应用程序的性能，如何处理多个并发数量的Ajax请求？

Answer 1

每个请求都是异步的，因此制作一堆类似的请求非常快，但它不能很好地扩展。每次发出请求时，一些开销进程会包装每个请求。它非常小，所以几十个请求它不是那么糟糕，当它有一千个请求，一百个用户（或更糟），你开始遇到问题。

如果您决定继续这个方向，那么如果您提前计划，它很容易将其转换为一个请求。构建一个业务委托，以便它获取一个列表并在收到所有响应后调用回调。像

这样的东西

MyWS = new MyWS(); // MyWS = your web service class
function getList(list,callback){
    var results = _.map(list,function(value,key){
        MyWS.getStreetDetail(value,function(response){
            console.log(response) // {data:{name:"LoveTree Way"...}}
            results[key] = response.data;
            check();
        });
    });
    function check(){
        if(_.all(results,function(value){return !!value;}))
            callback(results);
    }
}
list = [268,320,380];
getList(list,function(results){
    alert("results",results.toSource())
});

当然，我会将getList函数构建到您的委托中，这样您就可以忘掉它了。

new MyWS().getList([268,320,380],function(data){
    console.log("data",data)
});

Answer 2

如果在每个请求中传递相对少量的数据，最好将它们捆绑在一起 - 例如，在一个请求中的5（或10或20）条街道上请求信息。这将减少所需的请求数量......

在循环中发送jquery ajax请求

2 个答案: