jQuery的 .getJSON 使用ajax。http://api.jquery.com/jquery.getjson/
.ajax 使用XMLHttpRequest。
Chrome和其他浏览器的Web安全会阻止XMLHttpRequest访问本地文件,因为这是一个安全问题。
通过深度安全:本地网页
http://blog.chromium.org/2008/12/security-in-depth-local-web-pages.html
您收到了一封带有网页附件的攻击者发送的电子邮件,您下载了该附件。
您在浏览器中打开了现在的本地网页。
本地网页创建了一个iframe,其源是https://mail.google.com/mail/。
由于您已登录 Gmail,因此该框架会加载收件箱中的邮件。
本地网页使用JavaScript访问frames[0].document.documentElement.innerHTML读取框架的内容。(互联网网页无法执行此步骤,因为它来自非Gmail来源;同源策略将导致读取失败。)
本地网页将您的收件箱内容放入一个<textarea>中,并通过表单POST向攻击者的Web服务器提交数据。现在,攻击者拥有了您的收件箱,这可能对垃圾邮件或身份盗窃有用。
对于不需要同源策略安全的数据,解决方案是填充json。因为jsonp不是一种安全的数据格式。jsonp没有同源策略。
{
"one": "Singular sensation",
"two": "Beady little eyes",
"three": "Little birds pitch by my doorstep"
}
Mycallback ({
"one": "Singular sensation",
"two": "Beady little eyes",
"three": "Little birds pitch by my doorstep"
});
由于jsonp将json封装在一个有效的javascript函数中,因此可以像添加任何javascript到页面一样打开它。
var element = document.createElement("script");
element.src = "jsonp.js";
document.body.appendChild(element);
你的回调函数处理数据,
function Mycallback(jsondata) {
}
这与ajax请求在功能上基本相同,但不同之处在于它是一个jsonp请求,实际上更容易。
jQuery库也直接支持jsonp
http://api.jquery.com/jquery.getjson/。请参考使用Flickr的JSONP API的示例;除非知道这种双重标准,否则可能甚至不会注意到正在使用jsonp。
(function() {
var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON( flickerAPI, {
tags: "mount rainier",
tagmode: "any",
format: "json"
})
.done(function( data ) {
$.each( data.items, function( i, item ) {
$( "<img>" ).attr( "src", item.media.m ).appendTo( "#images" );
if ( i === 3 ) {
return false;
}
});
});
})();
本地访问json是可以启用的,但不同浏览器的操作方式不同。
在Chrome中使用--allow-file-access-from-files进行启用。
https://code.google.com/p/chromium/issues/detail?id=40787
FYI:他们正在开发加密JSON
https://datatracker.ietf.org/doc/html/draft-ietf-jose-json-web-encryption-08。我相当确定不会有本地使用的方法,意图是使其非常安全。