一尘不染

JavaScript:无法从本地主机加载JSON文件

json

我目前正在阅读“最先实现HTML5编程”一书。我想sales.json在自己的机器上加载从Web服务器命名的文件的内容。我为此使用了wampserver。

在文件夹wamp/www/gumball/我把所有相关的.html.js.css文件,也sales.json文件。

我的JavaScript代码非常简单:

window.onload = function() {
    var url = "http://localhost/gumball/sales.json";
    var request = new XMLHttpRequest();
    request.open("GET", url);
    request.onload = function() {
        if (request.status == 200) {
            updateSales(request.responseText);
        }
    };
    request.send(null);
}

function updateSales(responseText) {
    var salesDiv = document.getElementById("sales");
    salesDiv.innerHTML = responseText;
}

这什么也没做!键入链接:http://localhost/gumball/sales.json在我的浏览器中打开正确的文件,因此链接应该正确。即使使用.js本书随附的文件(带有我要制作的应用程序的最终版本),也不会加载任何内容。

使用警报语句进行测试可以告诉我该request.onload事件永远不会发生。对于这种情况,我一无所知。

我还不太了解的一个事实:当我http://localhost/gumball/sales.json:在浏览器中键入时(在链接末尾添加了一个冒号),我收到403
Forbidden错误!为什么会这样?这和我的问题有关吗?


阅读 261

收藏
2020-07-27

共1个答案

一尘不染

我用Firefox打开HTML文档

您的HTML文件必须与一个URL打开http://,不file://,如果你希望它能够在JavaScript中打开另一个文件,除非第二份文件送达相关CORS标头

这是由于相同的原产地政策

因为您有本地WAMP服务器,所以没有问题:只需http://像使用JSON文件一样使用URL 打开文件即可。

2020-07-27