使用Ajax从本地文件访问Web

Question

我对JQuery和Ajax有点陌生，所以如果这是新手的问题，我深表歉意。

我正在尝试使用本地文件中的ajax来访问Web（例如，获取文本文件）。
我没有使用IIS或任何其他来自硬盘驱动器的简单文件（我需要它保持这种状态）。
在IE8和Chrome（版本11.0.696.60）上都进行了检查。

这是一些JavaScript来说明：

// use ajax to load from the web
$("#webText").click(function(){
    $.get("http://www.w3schools.com/jquery/demo_ajax_load.txt", function(result){
        alert(result);
});

此代码试图从Web加载文本文件-IE和chrome上的操作均失败（无法获得成功功能）。
Chrome在错误控制台中通知 “ XmlHttpRequest无法加载
_http：//www.w3schools.com/jquery/demo_ajax_load.txt： Access-Control-Allow-
Origin不允许使用原点null”

// use ajax to load from a local file
$("#localText").click(function(){
    $.get("demo_ajax_load.txt", function(result){
        alert(result);
});

该代码正在尝试从本地文本文件加载。
IE：操作成功。 Chrome：失败，出现与上述相同的错误。

使用此处给出的示例，我尝试了：

// use ajax to load json object from the web
$("#webJSON").click(function(){
    var url = 'http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&minx=-30&miny=0&maxx=0&maxy=150';
    $.get(url, function(json) {
        alert(json.photos[1].photoUrl);
    }, "jsonp");
});

这段代码在两种浏览器上都很好用。因此很显然，可以从本地文件与Web服务进行通信。

有任何想法吗？

顺便说一句-我对IE方面更感兴趣，Chrome和其他浏览器不再是问题。

谢谢。

Answer 1

问题是您遇到了Same Origin
Policy
，该策略适用于所有“实际”
ajax调用（实际使用的调用XMLHttpRequest）。

IE可以运行，但Firefox和Chrome不能运行的原因很简单：当源是本地文件且您要检索的资源在网络上时，IE不会应用SOP。另一方面，Chrome和Firefox应用了W3C
的跨域资源共享标准，因此包含了相关的“这是我的来历，您可以和我谈谈吗？”
标头-w3schools说“不，我不会和你说话。” （“
null”是本地计算机的“原始”值。）选择浏览器的乐趣在于，它们可以对类似的事情做出不同的设计决策。

您发现有效的代码并未执行真正的ajax调用，而是执行了JSON-P，它根本没有使用XMLHttpRequest，因此绕过了SOP，但仅用于GET操作（不支持POST），并且仅当另一端支持它时。（jQuery的get函数既可以执行实际的ajax调用，也可以执行JSON-P，其作用的关键是dataType参数，在您显示的示例中为“
jsonp”。）

您可能会发现本文很有用。它描述了使用YQL（来自Yahoo的HTML抓取服务）作为跨域代理，因为YQL支持JSON-P。