jQuery 加载不适用于某些 .txt 文件

Posted

技术标签:

【中文标题】jQuery 加载不适用于某些 .txt 文件【英文标题】:jQuery load not working with certain .txt file 【发布时间】:2014-03-22 02:18:45 【问题描述】:

我有一个 jQuery 加载脚本,它奇怪地适用于托管在一个位置但不在另一个位置的文本文件。例如,这个:

JSFiddle

$(document).ready(function () 
    $("button").click(function () 
       $("#div10").load("https://dl.dropboxusercontent.com/u/29635158/replace.txt", function () 
          alert("Done Loading");
       );
    );
);

...工作正常,可以从我的 Dropbox 加载 .txt 文档。

但是这个:

JSFiddle

$(document).ready(function () 
    $("button").click(function () 
        $("#div10").load("http://hs.biocanvas.net/files/replace.txt", function () 
           alert("Done Loading");
        );
    );
);

...是完全相同的脚本,具有完全相同的.txt 文件,只是.txt 文件现在托管在不同的服务器上(并且脚本中的 URL 相应更改)。但是,.txt 文件并未加载到目标 div 中。

如果您复制 + 粘贴它们的网址到浏览器中,.txt 文件都是可读的。

有什么想法吗?感谢您的帮助。

【问题讨论】:

两件事,你在控制台中得到错误吗?为什么要使用 txt 文件? :S 控制台给出 No 'Access-Control-Allow-Origin' 标题应该是你的问题 您在下面得到了答案 ;) 【参考方案1】:

有点晚了 - 但只是为了确认 user3294396 的答案,如果你运行代码并查看控制台,你可能会看到如下错误:

XMLHttpRequest cannot load http://hs.biocanvas.net/files/replace.txt. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. 

所以你需要在服务器上设置显式访问。

【讨论】:

我尝试使用 Access-Control-Allow-Origin: * 编辑 .htaccess,但没有成功...我不确定我做错了什么(而且我可悲的是,我在这些事情上完全是新手......) 如果您使用的是 Apache(听起来确实如此) - 您可以发布您为 .htaccess 添加的内容吗?您是否尝试在进行编辑后重新启动 apache? 我已经修复它...我认为我的服务器更新文件只需要一段时间,但这是我添加到每个相关目录中的 .htaccess 文件来修复它:标头集 Access-Control-Allow-Origin *【参考方案2】:

问题可能是跨域请求。 如果您使用 php 或其他服务器技术,则需要在您的应用程序中允许权限,但如果您使用的是 phonegap,则不需要。

访问控制允许来源:http://example.org/

或者,如果它是公共资源:

访问控制允许来源:*

作为参考,您可以阅读这篇文章: HTTP access control (CORS) Developer mozilla

或AJAX - Introducing Cross-domain Request (XDR)

【讨论】:

感谢您的快速回复!说到这个,我完全天真……我该去哪里更改这些权限? 如果您使用的是 apache,例如,您可以通过 .htaccess 文件进行操作 ***.com/questions/14467673/enable-cors-in-htaccess 其他网络服务器具有类似的设置这些参数的方法。 你用的是PHP、.Net什么技术?还是只有javascript 服务器在 Apache 上,我相信...我正在尝试编辑 .htaccess 我设置了标头访问权限,诀窍是清空我的缓存,然后它就起作用了。非常感谢所有帮助过的人!

以上是关于jQuery 加载不适用于某些 .txt 文件的主要内容,如果未能解决你的问题,请参考以下文章

Jquery 选择器不适用于动态 .get 加载的内容

外部 js 脚本不适用于使用 jQuery 加载的页面

Angularjs 不适用于 Jquery 加载功能

JS 脚本不适用于使用 jQuery 的 .load() 加载的 div

Ajax 加载面板适用于 FF,但不适用于 Chrome。知道为啥吗?

字符串替换加载器不适用于 webpack 3