Question

我目前正在阅读“Head first HTML5 programming”一书。我想从我自己的机器上的Web服务器加载名为sales.json的文件的内容。我用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错误！为什么会这样？这与我的问题有关吗？

Answer 1

我用firefox
打开html文档

如果您希望能够在javascript中打开其他文档，则必须使用http://中的网址打开您的HTML文档，而不是file://，除非第二个文档与相关http://一起提供3}}

这是由于CORS headers。

由于您有本地WAMP服务器，因此没有问题：只需使用{J}文件中的{{1}} URL打开文件。

Javascript：无法从localhost加载JSON文件

1 个答案: