Matt..
16
检测JSONP问题
如果您不想下载依赖项,则可以自己检测错误状态.这很简单.
您只能通过使用某种超时来检测JSONP错误.如果在某个时间内没有有效响应,则假定出错.但错误基本上可以是任何错误.
这是一个检查错误的简单方法.只需使用一个success标志:
var success = false;
$.getJSON(url, function(json) {
success = true;
// ... whatever else your callback needs to do ...
});
// Set a 5-second (or however long you want) timeout to check for errors
setTimeout(function() {
if (!success)
{
// Handle error accordingly
alert("Houston, we have a problem.");
}
}, 5000);
作为评论中提到的dawnrider,您也可以使用clearTimeout:
var errorTimeout = setTimeout(function() {
if (!success)
{
// Handle error accordingly
alert("Houston, we have a problem.");
}
}, 5000);
$.getJSON(url, function(json) {
clearTimeout(errorTimeout);
// ... whatever else your callback needs to do ...
});
为什么?继续阅读......
以下是JSONP的工作原理:
JSONP不像常规AJAX请求那样使用XMLHttpRequest.相反,它会在页面中注入一个标记,其中"src"属性是请求的URL.响应的内容包含在Javascript函数中,然后在下载时执行.
例如.
JSONP请求: https://api.site.com/endpoint?this=that&callback=myFunc
Javascript会将此脚本标记注入DOM:
将标记添加到DOM 时会发生什么?显然,它会被执行.
因此,假设对此查询的响应产生了一个JSON结果,如:
{"answer":42}
对于浏览器来说,这与脚本的源代码相同,因此它会被执行.但是当你执行这个时会发生什么:
{"answer":42}
好吧,没什么.这只是一个对象.它不会被存储,保存,也没有任何反应.
这就是JSONP请求将其结果包装在函数中的原因.必须支持JSONP序列化的服务器会看到callback您指定的参数,并返回此参数:
myFunc({"answer":42})
然后执行此操作:
myFunc({"answer":42})
......这更有用.在这种情况下,代码中的某个地方称为全局函数myFunc:
myFunc(data)
{
alert("The answer to life, the universe, and everything is: " + data.answer);
}
而已.这就是JSONP的"神奇".然后构建一个超时检查非常简单,如上所示.发出请求后立即开始超时.在X秒后,如果您的标志仍未设置,则请求超时.