XMLHttpRequest Origin null不允许Access-Control-Allow-Origin for file:/// to file:///(Serverless)

Question

我正在尝试创建一个可以下载并通过启动其索引文件在本地运行的网站.

所有文件都是本地的,没有资源在线使用.

当我尝试使用jQuery的AJAXSLT插件来处理带有XSL模板的XML文件时(在子目录中),我收到以下错误:

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/data/home.xml. Origin null is not allowed by Access-Control-Allow-Origin.

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/assets/xsl/main.xsl. Origin null is not allowed by Access-Control-Allow-Origin.

发出请求的索引文件是file:///C:/path/to/XSL%20Website/index.html在存储使用的JavaScript文件时file:///C:/path/to/XSL%20Website/assets/js/.

我该怎么做才能解决这个问题？

Answer 1

对于无法运行本地网络服务器的情况,您可以允许Chrome file://通过浏览器开关访问文件.经过一番挖掘后,我发现了这个讨论,其中提到了开放帖子中的浏览器切换.运行您的Chrome实例:

chrome.exe --allow-file-access-from-files

对于开发环境而言,这可能是可以接受的,你当然不希望这一直存在.这仍然是一个悬而未决的问题(截至2011年1月).

另请参阅:Chrome中使用本地文件的jQuery getJSON问题

Answer 2

基本上解决这个问题的唯一方法是让一个webserver在localhost上运行并从那里为它们提供服务.

浏览器允许ajax请求访问计算机上的任何文件是不安全的,因此大多数浏览器似乎将"file://"请求视为"同源策略 " 没有来源

启动Web服务器可以像cd进入文件所在的目录一样简单:

python -m SimpleHTTPServer

Answer 3

此解决方案将允许您使用 jQuery.getScript() 加载本地脚本。这是一个全局设置，但您也可以在每个请求的基础上设置 crossDomain 选项。

$.ajaxPrefilter( "json script", function( options ) {
  options.crossDomain = true;
});

Answer 4

使用javascript FileReader函数打开本地文件怎么样，即：

<input type="file" name="filename" id="filename">
<script>
$("#filename").change(function (e) {
  if (e.target.files != undefined) {
    var reader = new FileReader();
    reader.onload = function (e) {
        // Get all the contents in the file
        var data = e.target.result; 
        // other stuffss................            
    };
    reader.readAsText(e.target.files.item(0));
  }
});
</script>

现在单击Choose file按钮并浏览到文件file:///C:/path/to/XSL%20Website/data/home.xml