javascript - 来自本地文件的 jQuery ajax 请求(Origin 'null' 不允许访问)

Question

我正在从本地文件进行 jQuery ajax 调用，该文件从网络服务器检索 JSON 数据:

$.ajax({
    type: 'GET',
    url: 'http://mywebsite.com/data.json',
    dataType: 'json',
    success: showData
});

我在 chrome 上收到以下错误:

XMLHttpRequest cannot load http://mywebsite.com/data.json. No 
'Access-Control-Allow-Origin' header is present on the requested 
resource. Origin 'null' is therefore not allowed access.

我阅读了很多其他答案，似乎得出的结论是，您无法使用 chrome 从本地文件发出 ajax 请求，因此解决方案是:

• 在服务器上托管发出请求的文件
• 使用“--allow-file-access-from-files”标志运行 chrome

但这两个选项都不适合我。

但是，当我在另一个站点 (myjson.com) 上托管 JSON 数据时，ajax 请求中的行会读取

url: 'https://api.myjson.com/bins/myfile'

文件加载完美，数据正确显示。

为什么允许向“myjson.com”发送ajax请求，但不允许向“mywebsite.com”发送ajax请求？

编辑:

我有电话

Header set Access-Control-Allow-Origin "*"

在我的 apache2.conf 文件中

Answer 1

您需要做的是在文档根目录中创建一个 .htaccess 文件并向其中添加以下行:

<FilesMatch "\.(json)$">
    Header set Access-Control-Allow-Origin "*"
</FilesMatch>

上面几行的作用是，它们允许 .json 文件上的所有域进行跨源资源共享，从而消除错误。