小编典典

jQuery ajax(jsonp)会忽略超时并且不会触发错误事件

ajax

为了添加一些基本的错误处理,我想重写一段代码,该代码使用jQuery的$ .getJSON从Flickr中提取一些照片。这样做的原因是$
.getJSON不提供错误处理或不处理超时。

由于$ .getJSON只是$ .ajax的包装,因此我决定重写该内容并感到惊讶,它可以完美地工作。

现在,乐趣开始了。当我故意导致404(通过更改URL)或导致网络超时(由于未连接到互连网)时,错误事件根本不会触发。我对我做错了事感到茫然。非常感谢您的帮助。

这是代码:

$(document).ready(function(){

    // var jsonFeed = "http://api.flickr.com/services/feeds/photos_public.gne"; // correct URL
    var jsonFeed = "http://api.flickr.com/services/feeds/photos_public.gne_______"; // this should throw a 404

    $.ajax({
        url: jsonFeed,
        data: { "lang" : "en-us",
                "format" : "json",
                "tags" : "sunset"
        },
        dataType: "jsonp",
        jsonp: "jsoncallback",
        timeout: 5000,
        success: function(data, status){
            $.each(data.items, function(i,item){
                $("<img>").attr("src", (item.media.m).replace("_m.","_s."))
                          .attr("alt", item.title)
                          .appendTo("ul#flickr")
                          .wrap("<li><a href=\"" + item.link + "\"></a></li>");
                if (i == 9) return false;
            });
        },
        error: function(XHR, textStatus, errorThrown){
            alert("ERREUR: " + textStatus);
            alert("ERREUR: " + errorThrown);
        }
    });

});

我想补充一点,当jQuery在1.4.2版本时,这个问题被问到了


阅读 279

收藏
2020-07-26

共1个答案

小编典典

jQuery
1.5及更高版本对JSONP请求的错误处理提供了更好的支持。但是,您需要使用$.ajax方法而不是$.getJSON。对我来说,这有效:

var req = $.ajax({
    url : url,
    dataType : "jsonp",
    timeout : 10000
});

req.success(function() {
    console.log('Yes! Success!');
});

req.error(function() {
    console.log('Oh noes!');
});

当10秒后没有成功的请求时,超时似乎可以解决问题并调用错误处理程序。

我也对此主题做了一个小博文

2020-07-26