jQuery $ .ajax作为本地HTML文件运行，避免了SOP(同一原始策略) [英] jQuery $.ajax run as a local HTML file avoiding SOP (same origin policy)
问题描述
我创建了一个具有以下内容的HTML文件foo.html:
I created an HTML file foo.html with the following contents:
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script>
$.ajax({url:"http://foo.com/mdata",
error: function (results) {
alert("fail");
},
success: function (result) {
alert("sucesses");
}
});
</script>
当我在Web浏览器中加载此HTML文件时，它总是显示一个失败的对话框.
When I load this HTML file in the web browser it always shows a dialog box with fail.
- 知道为什么会这样吗?
- 还有什么最好的调试方法?
PS:
假定http://foo.com/mdata是有效的Web服务路径.
Assume that http://foo.com/mdata is a valid web service path.
EDIT#1
解决方案
使用$ .getJson，类似的代码对我来说效果很好 http://jsfiddle.net/dpant/EK3W8/
a similar code worked perfectly fine with me using $.getJson http://jsfiddle.net/dpant/EK3W8/
我也确实将内容另存为.html文件，并且从file://到Web服务的请求似乎也可行.
i also did save the content as a .html file and a request from file:// to an web service also seems to work.
<!DOCTYPE html>
<html>
<head>
<style>img{ height: 100px; float: left; }</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div id="images">
</div>
<script>
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
{
tags: "mount rainier",
tagmode: "any",
format: "json"
},
function(data) {
$.each(data.items, function(i,item){
$("<img/>").attr("src", item.media.m).appendTo("#images");
if ( i == 3 ) return false;
});
});</script>
</body>
</html>
看起来大多数浏览器都支持CROS，因此您可以编写脚本将其另存为.html并在浏览器中打开，它将成功执行Ajax请求* 前提是您发出请求的服务器支持它* .在这种情况下，我的Web服务器(服务)不支持CROS(而Apache的默认配置将不支持它).
Looks like most of the browsers supports the CROS so you can write a script save it as .html and open it in browser and it will do a Ajax request successfully *provided that the server you are making request supports it *. In this case my web server (service) does not support CROS (and default configuration of Apache will not support it).
许多Web服务已启用CROS，例如 http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback= ?因此请求成功完成.
Many of the web-services have enabled the CROS eg http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=? hence the request goes through successfully.
很少链接:
https://developer.mozilla.org/zh-CN/docs/HTTP/Access_control_CORS
http://en.wikipedia.org/wiki/Cross-Origin_Resource_Sharing
推荐答案
它总是失败有两个原因:
It always fails for two reasons:
- 您需要一个Web服务器，该服务器在 Mac 查看Bitnami
- 您无法通过AJAX调用其他域.如果您在www.example.com上运行脚本，则不能要求www.example.net 看在相同的原产地政策.
- You need a webserver that answers to your request (200 = success, 404 i.e. is an error) on Linux you can easily setup one, on Windows and Mac look at Bitnami
- You can't call a different domain via AJAX. If you're running your script on www.example.com you can't ask for www.example.net Look at the same origin policy.
这篇关于jQuery $ .ajax作为本地HTML文件运行，避免了SOP(同一原始策略)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
