【问题标题】:jQuery ajax success callback not firingjQuery ajax 成功回调未触发
【发布时间】:2012-05-04 00:52:19
【问题描述】:

我正在使用 jQuery 的 $.ajax 方法从与 JSONP 兼容的 Web 服务中获取数据,并且就获得响应并在我的 HTML 中显示接收到的数据而言,一切似乎都运行良好。但是,我无法让 ajax 方法的成功回调触发。更奇怪的是,即使我确实得到了服务的有效响应,错误回调总是会被触发。

这是一个简单的 js 函数示例,用于测试:

function doJsonp()
{
    $.ajax({
        url: "http://example.com/api/service?callback=blah",
        dataType: "jsonp",
        crossDomain: true,
        success: function() { console.log("success"); }, // This is never fired
        error: function() { console.log("error"); } // This is always fired
    });
}

以及匹配的回调函数:

function blah(data)
{
    console.log(data); // This is called properly
}

通过阅读关于 SO 和其他地方的类似问题,似乎这通常是由服务返回的 JSON 未验证引起的。出于我的目的,我使用的是内部 Web 服务,但也尝试了其他 JSONP 服务,例如 Flickr 提供的服务,例如:

http://api.flickr.com/services/feeds/groups_pool.gne?id=807213@N20&lang=en-us&format=json&jsoncallback=blah

Flickr 服务和我的 JSON 都使用 jsonlint 进行验证,因此据我所知,这似乎不是问题。

在寻找此问题的解决方案时,我尝试使用名为 jquery-jsonp 的 jQuery 插件,该插件位于 http://code.google.com/p/jquery-jsonp/。这将 jQuery 的 $.ajax 调用替换为它自己的 $.jsonp,因此上面的代码如下所示:

function doJsonp()
{
    $.jsonp({
        url: "http://example.com/api/service?callback=blah",
        success: function() { console.log("success"); },
        error: function() { console.log("error"); }
    });
}

但是,结果是相同的,并且成功回调永远不会触发。任何帮助或朝着正确方向轻推将不胜感激!

【问题讨论】:

  • 服务器响应是什么?您可以在 Dragonfly(opera)、Firebug(FireFox)、Developer Tools (Chrome) 等开发者工具中找到它
  • url: "example.com/api/service?callback=blah" != 你的函数名 bleh()。会不会是笔误?
  • @BartoszGrzybowski 服务器响应状态为 200 OK
  • @junior 这是我在输入问题时犯的错字,我现在已经修正了。
  • @MarkSchultheiss 抱歉,下次我会记住的。虽然问题不在于错误的处理,而是它在不应该出现的时候被抛出。

标签: json jquery jsonp


【解决方案1】:

通过 jsonpCallback 选项定义回调函数,而不是在 url 内:

function doJsonp()
{
    $.ajax({
        url: "http://api.flickr.com/services/feeds/groups_pool.gne?id=807213@N20&lang=en-us&format=json&jsoncallback=?",
        dataType: "jsonp",
        crossDomain: true,
        jsonpCallback:'blah',//<<<
        success: function() { console.log("success"); }, 
        error: function() { console.log("error"); } 
    });
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-03-20
    • 1970-01-01
    • 1970-01-01
    • 2018-12-23
    • 2013-09-14
    • 2011-02-22
    • 2013-05-20
    • 2016-03-25
    相关资源
    最近更新 更多