多个异步 AJAX 调用最佳实践答案

【问题标题】：Multiple Async AJAX Calls Best Practice多个异步 AJAX 调用最佳实践
【发布时间】：2014-07-01 03:05:47
【问题描述】：

我有一个关于在单个页面上进行多个 AJAX 调用的“最佳实践”的问题。

我需要异步进行 5 次独立调用。我知道 $.ajax 本质上是异步的，但我很好奇是否有一种“更清洁”或“更好”的方式来执行多个 AJAX 调用。

下面是包含多个 AJAX 调用的示例：

$(function() {
  $.ajax({
    type: "GET",
    url: "https://api.github.com/users/ralvarenga",
    dataType: "json",
    success: function(data) { console.log(data); }
  });
  $.ajax({
    type: "GET",
    url: "https://api.github.com/users/dkang",
    dataType: "json",
    success: function(data) { console.log(data); }
  });
});

提前感谢您的帮助！

【问题讨论】：

标签： javascript jquery ajax api asynchronous

【解决方案1】：

你应该使用$.when()。

$.when($.ajax("/page1.php"), $.ajax("/page2.php")).done(function (a1, a2) {
    //all AJAX requests are finished
});

或者：

$.when( $.ajax( "/page1.php" ), $.ajax( "/page2.php" ) )
    .then( successFunction, failureFunction );

【讨论】：

所以我使用了 when 和 then 方法。虽然它的行为不像我想象的那样。看看这个小提琴并检查控制台中的响应。 jsfiddle.net/8us9t/2 ...为什么单个请求只返回数据，但多请求返回一个带有大量其他内容的更大对象。任何建议将不胜感激！
所以我最终得到了我想要的东西：jsfiddle.net/8us9t/4，但我只是好奇是否有一种更简洁的方法，然后指定我只想要通过以下“数据 [2 ].responseJSON" .
您的提议是在两个 ajax 调用都成功时运行 done、then 函数，但我认为这不是 OP 所要求的。每次调用都可以失败或成功，而不会相互干扰（例如同时加载新闻和产品列表）。只有在两个调用都必须成功才能继续时，才应使用此解决方案。