Jquery 不允许XMLHttpRequest Origin null文件的访问控制允许原点：///到文件：///（无服务器）

我正试图创建一个网站，可以下载和运行本地启动其索引文件

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

当我尝试使用jQuery的AJAXSLT插件处理带有XSL模板的XML文件（在子目录中）时，我收到以下错误：

XMLHttpRequest无法加载file:///C:/path/to/XSL%20Website/data/home.xml. 访问控制允许原点不允许原点为空。

XMLHttpRequest无法加载file:///C:/path/to/XSL%20Website/assets/xsl/main.xsl. 访问控制允许原点不允许原点为空。

发出请求的索引文件是

file:///C:/path/to/XSL%20Website/index.html

而使用的JavaScript文件存储在

file:///C:/path/to/XSL%20Website/assets/js/

---

如何解决此问题？

基本上，解决此问题的唯一方法是在本地主机上运行Web服务器，并从那里为它们提供服务

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

启动Web服务器就像将文件放入并运行的目录中一样简单：

python -m SimpleHTTPServer

---

对于不能运行本地Web服务器的情况，您可以通过浏览器开关允许Chrome访问

文件：//

文件。经过一些挖掘，我发现，其中提到了一个浏览器开关打开后。使用以下工具运行您的Chrome实例：

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

这对于开发环境来说可能是可以接受的，但除此之外就没有什么了。您肯定不希望一直使用它。这似乎仍然是一个悬而未决的问题（截至2011年1月）

---

另请参见：

这是一个applescript，它将在打开--allow file access from files开关的情况下启动Chrome，适用于OSX/Chrome开发者：

set chromePath to POSIX path of "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"    
set switch to " --allow-file-access-from-files"
do shell script (quoted form of chromePath) & switch & " > /dev/null 2>&1 &"

---

您可以尝试将

'Access-Control-Allow-Origin'：'*'

放在

响应中。writeHead（，{[here]}）

此解决方案将允许您使用jQuery.getScript（）加载本地脚本。这是一个全局设置，但您也可以根据每个请求设置crossDomain选项

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

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

<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>

$（“#文件名”）.change（函数（e）{
如果（e.target.files！=未定义）{
var reader=new FileReader（）；
reader.onload=函数（e）{
//获取文件中的所有内容
var数据=e.target.result；
//其他材料。。。。。。。。。。。。。。。。
};
reader.readAsText（e.target.files.item（0））；
}
});

---

现在单击

选择文件
按钮并浏览到文件
file:///C:/path/to/XSL%20Website/data/home.xml
像这样启动chrome以绕过此限制：
打开-a“/Applications/Google chrome.app/Contents/MacOS/Google chrome”--args--允许从文件访问文件

派生自，但我需要指定Google Chrome的完整路径，以避免Google Chrome从我的Windows分区（并行）打开。
我刚才解决这个问题的方法是根本不使用XMLHTTPRequest，而是将所需的数据包含在单独的javascript文件中。（在我的例子中，我需要使用一个二进制SQLite blob）

我创建了一个名为
base64_data.js
（并使用
btoa（）
转换我需要的数据并将其插入到
中，以便复制它）

var base64_data=“U1FMaXRlIGZvcm1hdCAzAAQA…AhEHwA=”；

然后像普通javascript一样将数据包含在html中：

<div id="test"></div>

<script src="base64_data.js"></script>
<script>
    data = atob(base64_data);
    var sqldb = new SQL.Database(data);
    // Database test code from the sql.js project
    var test = sqldb.exec("SELECT * FROM Genre");
    document.getElementById("test").textContent = JSON.stringify(test);
</script>


数据=atob（基本64_数据）；
var sqldb=新的SQL.Database（数据）；
//sql.js项目中的数据库测试代码
var test=sqldb.exec（“从流派中选择*）；
document.getElementById（“test”）.textContent=JSON.stringify（test）；

我想，修改它来读取JSON，甚至是XML都是很简单的；我将把它作为练习留给读者；）
 使用“chrome应用程序的web服务器”。（不管你知道与否，你的电脑上都有它。只需在cortana中搜索即可！）。打开它并单击“选择文件”选择包含您的文件的文件夹不要实际选择您的文件。选择您的文件文件夹，然后单击“选择文件夹”按钮下的链接

如果它不带您到文件，那么将文件名添加到urs。像这样：

   https://127.0.0.1:8887/fileName.txt

链接到chrome浏览器的web服务器：
如果您只需要在本地访问文件，则可以包括文件的确切路径，而不是使用

../images/img.jpg

使用

CORS发生的原因是，您正试图遍历网页中的另一个目录，通过包含您不更改目录的直接路径，您正在从一个直接位置进行提取。
我希望开发一个解决方案，该解决方案不需要用户使用其web浏览器以外的任何东西。使用Python、任何解释器或任何非系统无关软件都是不可行的。我能想到的唯一其他解决方案是在一个页面中加载整个内容，这样就不需要向文件系统发出任何ajax请求。谢谢@Singletoned！我正在使用你的解决方案，它非常方便！如果您使用的是Python3，那么命令应该是
Python-mhttp.server
@Rich，很高兴它有帮助！我想知道，随着谷歌推动基于浏览器的应用程序，是否会有更大的需求。我认为需求只会增长。这对macs OS X很有帮助。谢谢，我想知道我在哪里编码错了，似乎是浏览器的问题。有什么原因吗？允许从文件访问文件不会解决这个问题。我只是想加载一个脚本文件，比如so$.getScript（“application.js”）；然后得到问题中描述的错误。然而，这是有效的“在执行命令之前，确保所有的色度
../images/img.jpg

C:/Users/username/directoryToImg/img.jpg