JSONP 请求错误处理

Posted

技术标签:

【中文标题】JSONP 请求错误处理【英文标题】:JSONP request error handling 【发布时间】:2013-10-02 20:29:09 【问题描述】:

我正在发出 ajax jsonp 请求,但失败错误处理不起作用。如果请求是 404 或 500 则不会处理错误。

我一直在四处寻找答案,但找不到任何东西。 http://code.google.com/p/jquery-jsonp/ 似乎有一个解决方案,但我找不到任何关于如何使用它的示例。

function authenticate(user, pass)        
    $.ajax (
        type: "POST",
        url: "url",
        dataType: 'jsonp',
        async: false,
        //json object to sent to the authentication url
        data: "u": userid, "p": pass,

        success: function (data) 
            //successful authentication here
            console.log(data);
        ,
        error: function(XHR, textStatus, errorThrown) 
            alert("error: " + textStatus);
            alert("error: " + errorThrown);
        
    )

【问题讨论】:

【参考方案1】:

如果你查看jQuery.ajax() documentation,你可以找到:

错误

请求失败时调用的函数 (...) 注意:对于跨域脚本和跨域 JSONP 请求,调用此处理程序。这是一个 Ajax 事件。

因此,您不得不寻找解决方法。您可以指定超时以触发错误回调。这意味着在指定的时间范围内,请求应该成功完成。否则,假设它失败了:

$.ajax(
    ...
    timeout: 5000, // a lot of time for the request to be successfully completed
    ...
    error: function(x, t, m) 
        if(t==="timeout") 
            // something went wrong (handle it)
        
    

);

代码中的其他问题...

虽然JSONP(查看here 和here)可用于克服原始策略限制,但您不能使用JSONP POST(请参阅CORS),因为它只是doesn't work that way - 它创建了一个元素来获取数据,这必须通过 GET 请求来完成。 JSONP方案不使用XmlHttpRequest对象,所以不是标准理解的AJAX请求,但内容仍然是动态访问的——对最终用户来说没有区别。

$.ajax(
    url: url,
    type: "GET"
    dataType: "jsonp",
    ...

其次,您提供的数据不正确。您将 javascript 对象(使用对象文字创建)推送到线路上,而不是其序列化的 JSON 表示。创建 JSON 字符串(不是手动,使用例如 JSON.stringify 转换器):

$.ajax(
    ...
    data: JSON.stringify(u: userid, p: pass),
    ...

上一期,您已将 async 设置为 false,而文档显示:

跨域请求和dataType:“jsonp”请求不支持 同步操作。

【讨论】:

只想补充一点,上面答案中链接到的 AJAX 文档也在 timeout 参数下声明:In Firefox 3.0+ only, script and JSONP requests cannot be cancelled by a timeout; the script will run even if it arrives after the timeout period. 蒂姆麦克卢尔。 Tim Mclure 说的是真的,我已经在互联网上搜索了 2 天多,现在试图找到关于如何处理“未捕获的类型错误:jQuery110203912213369484832883_193467225 不是函数”的解决方案。 Try-catch 没有捕获它。我用它包裹了我的 $.ajax 调用,但没有运气。【参考方案2】:

两种处理错误的方法,

    跨域 JSONP 请求没有错误处理。使用 Github https://github.com/jaubourg/jquery-jsonp 上提供的 jsonp 插件,它提供了对错误处理的支持。

    jQuery ajax 超时 - 在合理的时间后超时以触发错误回调,因为它可能已静默失败。您可能不知道实际的错误(或错误状态)是什么,但至少您可以处理错误

【讨论】:

方法2在下面的答案中演示:***.com/a/19185826/193653【参考方案3】:

我和你一样一直在努力处理 ajax jsonp DataType 请求的错误,但是我想和你分享我的代码,希望对你有帮助。一个基本的事情是在ajax请求中包含一个超时,否则它永远不会进入错误:函数

$.ajax(
url: "google.com/api/doesnotexists",
dataType: "jsonp",
timeout: 5000,

success: function (parsed_json) 
console.log(parsed_json);
,

error: function (parsedjson, textStatus, errorThrown) 
console.log("parsedJson: " + JSON.stringify(parsedjson));

$('body').append(
    "parsedJson status: " + parsedjson.status + '</br>' + 
    "errorStatus: " + textStatus + '</br>' + 
    "errorThrown: " + errorThrown);        

 
);

jsfiddle - Handle Errors with jquery ajax call and JSONP dataType - Error 404

【讨论】:

看起来它最初似乎可以工作,但不幸的是使用“google.com/api/doesnotexists”将发出 jQuery 请求 http://fiddle.jshell.net/_display/google.com,而不是 google.com。如果您在 URL 前加上 http,您将看到正确的行为,其中观察到超时并且不返回任何状态。 投了反对票,因为我确认了@Mig 报告的内容;在这个例子中请求的 URL 是错误的。 很好的例子,这对我有用,因为伪 URL 而投反对票?真的!【参考方案4】:

我正在构建一个使用 jquery-jsonp 的脆弱 JS 项目,并提出了一种双 jsonp/ajax 方法,无论最终使用哪种方法都可以处理错误。

function authenticate(user, pass) 
    var ajax = ($.jsonp || $.ajax)(
        'url': /* your auth url */,
        'data':  /* user, pass, ... */ ,
        'contentType': "application/javascript",
        'dataType': 'jsonp',
        'callbackParameter': 'callback'  // $.jsonp only; $.ajax uses 'jsonpCallback'
    );
    ajax.done(function (data) 
        // your success events
    );
    ajax.fail(function (jqXHR, textStatus, errorThrown) 
        // $.jsonp calls this func as function (jqXHR, textStatus)
        // and $.ajax calls this func with the given signature
        console.error('AJAX / JSONP ' + textStatus + ': ' +
            (errorThrown || jqXHR.url));
    );

由于 jquery-jsonp 和 $.ajax 都支持 jQuery Deferred 规范,我们可以将两个错误处理程序合并在一起,处理 400 和 500 系列错误,以及查找超时。

【讨论】:

【参考方案5】:

老问题,但我有同样的问题。这是一个对我有用的解决方案。

如果您拥有您发出请求的域,您可以在响应中设置一个变量并在客户端检查它。

服务器端:

SERVER_RESPONSE=true; Callback(parameter1, parameter2);

客户端:

if(typeof SERVER_RESPONSE === 'undefined')
  console.log('No Response, maybe server is down');

else
  console.log('Got a server response');

【讨论】:

以上是关于JSONP 请求错误处理的主要内容,如果未能解决你的问题,请参考以下文章

angularjs中jsonp请求的异常处理

在跨域请求中捕获 JSONP 错误

PHP:处理“JSONP”输出与“JSON”及其解析?

处理跨域 jsonp 调用的 jQuery.ajax 错误

跨域问题解决方案

使用 JavaScript 制作和处理 JSONP 请求