使用 jsonp 错误的 jQuery ajax 请求
Posted
技术标签:
【中文标题】使用 jsonp 错误的 jQuery ajax 请求【英文标题】:jQuery ajax request using jsonp error 【发布时间】:2011-07-11 23:06:52 【问题描述】:我正在编写一个应用程序,我需要从另一台服务器访问客户端的一些 json 数据。由于跨域问题,我打算使用 jsonp。 jQuery 允许我使用 $.getJSON() 方法执行此操作,但是,我无法判断该方法是否失败(即服务器没有响应或其他原因)。所以我尝试了使用 $.ajax 来获取 JSON 数据的方法。但它不起作用,我不知道该尝试什么。 这是一个显示我的问题的示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>TEST</title>
<script type="text/javascript" src="scripts/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
$('#button_detect').click(function()
var feedApiAjax = 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&q=';
var feedApiGetJSON = 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&callback=?&q=';
var feedUrl = 'http://www.engadget.com/rss.xml';
$.ajax(
url: feedApiAjax + feedUrl,
datatype: 'jsonp',
success: function(data)
console.log('$.ajax() success');
,
error: function(xhr, testStatus, error)
console.log('$.ajax() error');
);
$.getJSON(
feedApiGetJSON + feedUrl,
function(data)
console.log('$.getJSON success');
);
);
);
</script>
</head>
<body>
<div id="button_detect">CLICK ME!!!!</div>
</body>
如果您使用此代码创建一个网页并单击“Click Me” div,您将看到 $.getJSON 请求正在运行,而 $.Ajax 请求则没有。我试过放置/删除“回调=?” tg,使用了“jsonp”和“json”数据类型,但这些都不起作用。
知道我做错了什么吗?
干杯!
【问题讨论】:
您可能还应该仔细检查以确保feedUrl
不需要为请求进行百分比编码。
【参考方案1】:
当dataType为jsonp时,jquery不会自动触发error函数。这在“错误”选项下的文档中进行了描述:
注意:跨域脚本和 JSONP 不调用此处理程序 要求。 see here.
解决方法是明确指定超时作为选项。如果服务器在指定的时间内没有响应,则会调用错误函数。有关此here 的更多信息。
【讨论】:
jQuery 2.0 似乎不再是这种情况了?【参考方案2】:之前遇到过这个错误,使用jquery-JSONP后解决了
[示例]
$.getJSON('http://server-url/Handler.ashx/?Callback=DocumentReadStatus',
userID: vuserID,
documentID: vdocumentID
,
function(result)
if (result.readStatus == '1')
alert("ACCEPTED");
else if (result.readStatus == '0')
alert("NOT ACCEPTED");
else
alert(result.readStatus);
);
【讨论】:
这可能是一个解决方案,但使用它我无法判断调用是否失败(它只在调用成功时提供回调)。关于如何检测呼叫是否失败的任何想法? @Brafales:jQuery JSONP 功能之一是错误恢复,请查看以下链接 code.google.com/p/jquery-jsonp/wiki/TipsAndTricks 以获取“简单用法”部分。如果发生任何错误,您可以轻松地提供错误消息。【参考方案3】:用于解析外部提要并捕获可能的错误,您可以使用它
function GetContent(feedUrl)
var feedApiGetJSON = 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&callback=?&q=';
$.ajax(
url: feedApiGetJSON + feedUrl,
dataType: 'jsonp',
jsonpCallback: 'JsonpCallback'
);
function JsonpCallback(data)
if (data.responseStatus == "200")
alert(data.responseData.feed.title);
else
alert(data.responseDetails);
【讨论】:
【参考方案4】:用数据类型替换:数据类型
【讨论】:
以上是关于使用 jsonp 错误的 jQuery ajax 请求的主要内容,如果未能解决你的问题,请参考以下文章
带有 jsonp 内容类型的 jQuery.ajax 请求后的解析器错误
使用 jquery ajax jsonp 调用 web 服务:错误
JQuery - $.ajax() - 使用 JSONP 的跨域 - 仅在 IE 8 中获取“解析器错误”(在 IE 7 中工作)