在 jQuery 中保持 AJAX 个请求串行

Keeping AJAX Requests Serial in jQuery

我有一些代码 recently moved to FastCGI for a backend 可以满足来自基于 jQuery 的前端的 AJAX 请求。问题是,虽然 FastCGI 在很大程度上加速了它,但实际上我从两个 jQuery AJAX 请求连续太快击中它时遇到了负面性能问题。我想做的是“锁定”AJAX 以便请求以串行方式而不是并行方式发生——每个请求只需要大约 180 毫秒来执行,但是如果第二个请求在第一个请求完成之前进入,第二个请求最终花费了大约一秒半。

我想我可以让它串行化的明显方法是在前一个请求的 .done 部分中放置一个 $.ajax 请求,但是请求属于不同的函数并且需要保持这种状态,因为他们并不总是需要一起被解雇——只是经常如此。想象一下:

function loadCategories () {
   // Do some organizing stuff, set url, etc.
    $.ajax({
        url: url,
        data: parameters,
        type: "GET",
        dataType : "json",
    })
      .done(function( json ) {
         //process sidebar category data.
      });
}

function loadArticles () {
   // Do some organizing stuff, set url, etc.
    $.ajax({
        url: url,
        data: parameters,
        type: "GET",
        dataType : "json",
    })
      .done(function( json ) {
         //process article data.
      });

}

这两个函数都在第三个函数中调用:

function loadPage (parameters) {
    loadCategories(parameters);
    loadArticles(parameters);
}

我想做的是在这两个函数中保留 .done.always 逻辑, 但也 return这些函数的承诺,这样我就可以使用 $.then 来阻止 loadArticles 触发,直到 loadCategories 完成。我试图找出正确的方法来做到这一点,但还没有成功地找到正确的方法。

具有 return Deferred 对象 $.ajax() return 的函数,然后您可以在调用函数中等待它。

function loadCategories() {
  // Do some organizing stuff, set url, etc.
  return $.ajax({
      url: url,
      data: parameters,
      type: "GET",
      dataType: "json",
    })
    .done(function(json) {
      //process sidebar category data.
    });
}

function loadArticles() {
  // Do some organizing stuff, set url, etc.
  return $.ajax({
      url: url,
      data: parameters,
      type: "GET",
      dataType: "json",
    })
    .done(function(json) {
      //process article data.
    });
}

function loadPage(parameters) {
  $.when(loadCategories(parameters)).then(
    function() {
      loadArticles(parameters)
    };
  });
}