jquery - 从失败的 JQuery jqXHR 请求中获取更多信息

Question

我正在使用 JQuery 的 $.when 和 $.get 来获取一些数据并对其执行某些操作。当获取它或对其执行某些操作时出现错误时，我想处理该错误，并根据我正在获取的数据/在哪个路径上获取它，以不同的方式处理它。

不幸的是，传递给 $.when().fail(...) 的信息很少，并且不包含该信息。我如何才能以一种非 hacky[1] 的方式从可推迟的信息中冒泡出来？

$.when(get(path1), get(path2)
  .done(function(parsed1, parsed2) {
    // do something with this date
  }).fail(function(jqXHR, statusTxt, errTxt) {
    // do something depending on which path failed...
  });

function get(path) {
  var parser = U.parser();
  return $.get('/getter' + path)
    .then(function(data) {
      return parser(data);
    });
}

[1]:当然，我可以关闭路径和一些我想要处理失败的全局对象，并在 Deferred 上的 .fail() 中处理它 $ .get 返回。我也可以放弃一个没有失败的 Deferred，但以某种方式包装了失败，但这也感觉很hacky。

Answer 1

由于 jqXHR 对象是传回 $.when() 的对象之一看来你可以把与你的要求相关的东西放在那里。例如，如果路径是您想要的，您可以这样做:

function get(path) {
  var parser = U.parser();
  var p = $.get('/getter' + vcfPath)
    .then(function(data) {
      return parser(data);
    });
  p.myPath = path;
  return p;
}

然后，在您的 $.when() 中处理程序，您将拥有可以从中提取参数的 jqXHR 对象。

注意，$.when()一旦任何单个请求被拒绝，就会被拒绝。如果您确实希望所有请求继续，并且想知道所有请求何时已完成(无论是解决还是拒绝)，则不能使用 $.when()为了那个原因。 jQuery 本身并不提供该功能。您可以自己构建它，也可以使用提供该功能的外部 promise 库(我使用 Bluebird，它具有 Promise.settle() 。

这是一个工作示例:

var data = {
    json: JSON.stringify({
        text: 'some text',
        array: [1, 2, 'three'],
    }),
    delay: 1
}


function runAjax(data, value) {
    var p = $.ajax({
        url:"/echo/json/",
        data:data,
        type:"POST",
    });
    // put something on the jqXHR object for retrieval later
    p.myData = value;
    return p;    
}

function runAjaxFail(data, value) {
    var p = $.ajax({
        url:"/echo/junk/",
        data:data,
        type:"POST",
    });
    // put something on the jqXHR object for retrieval later
    p.myData = value;
    return p;    
}

$.when(runAjax(data, "Hello"), runAjax(data, "GoodBye"), runAjaxFail(data, "My Fail Message")).then(function(r1, r2) {
    // for each arg [0] is data, [1] is status, [2] is jqXHR object
    log(r1[2].myData);   // logs "Hello"
    log(r2[2].myData);   // logs "GoodBye"
}, function(jqXHR, textStatus, errorThrown) {
    // fail handler
    log("fail: " + jqXHR.myData);
});

工作演示:http://jsfiddle.net/jfriend00/g8z353cz/

<小时/>

这是 Promise 世界完全支持的另一种方法。这接管了 ajax promise 的解析，以便您可以准确地放入您想要的任何数据。在这个特定的实现中，我选择始终解析并仅使用解析值中的数据来告诉您哪些 ajax 调用成功或失败，但如果您愿意，也可以使用带有值的拒绝。这保证会一直传播回来:

function get(path) {
    var parser = U.parser();
    var d = $.Deferred();
    $.get('/getter' + path)
        .then(function(data) {
            d.resolve(parser(data));
        }, function(jqXHR) {
            // error handler
            d.resolve({path: path, jqXHR: jqXHR});
        });
    return d.promise();
}

<小时/>

而且，您可以在这里看到这种实现:http://jsfiddle.net/jfriend00/c0u40gqh/