admin管理员组文章数量:1390248
I'm currently working through the book "Head first HTML5 programming". I want to load the content of a file named sales.json
from a web server on my own machine. I used wampserver for this.
In the folder wamp/www/gumball/
I put all relevant .html
, .js
and .css
files, and also the sales.json
file.
My JavaScript code is very simple:
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;
}
This doesn't do anything! Typing the link: http://localhost/gumball/sales.json
in my browser opens the right file, so the link should be correct. Even when using the .js
files that e with the book (with a finished version of the application I'm trying to make), nothing loads.
Testing with alert statements tells me the request.onload
event never happens. I'm clueless as to why this is the case.
A fact I don't quite understand yet: when I type: http://localhost/gumball/sales.json:
in my browser (I added a colon at the end of the link), I get a 403 Forbidden error! Why does this happen? Does this have something to do with my problem?
I'm currently working through the book "Head first HTML5 programming". I want to load the content of a file named sales.json
from a web server on my own machine. I used wampserver for this.
In the folder wamp/www/gumball/
I put all relevant .html
, .js
and .css
files, and also the sales.json
file.
My JavaScript code is very simple:
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;
}
This doesn't do anything! Typing the link: http://localhost/gumball/sales.json
in my browser opens the right file, so the link should be correct. Even when using the .js
files that e with the book (with a finished version of the application I'm trying to make), nothing loads.
Testing with alert statements tells me the request.onload
event never happens. I'm clueless as to why this is the case.
A fact I don't quite understand yet: when I type: http://localhost/gumball/sales.json:
in my browser (I added a colon at the end of the link), I get a 403 Forbidden error! Why does this happen? Does this have something to do with my problem?
-
How do you open the initial file ? You must open it through
http://localhost/...
, notfile://
– Denys Séguret Commented Sep 1, 2013 at 13:55 - What URL are you loading from? – SLaks Commented Sep 1, 2013 at 13:57
- What do you mean? You can see the way I try to reach the file in my code, and typing localhost/gumball/sales.json in the browser returns the desired file. So I'm not opening it from file://. When I take the wamp server offline, the link I use doesn't work. – tauros_is_the_best_pokemon Commented Sep 1, 2013 at 13:58
- @Kappie001 — dystroy and SLaks are asking how you open the HTML document, not the JSON document. – Quentin Commented Sep 1, 2013 at 13:58
- @Kappie001 have you receive any errors in console? – user2368299 Commented Sep 1, 2013 at 13:58
1 Answer
Reset to default 3I open html document with firefox
Your HTML document must be open with a URL in http://
, not file://
, if you want it to be able to open in javascript another document, unless the second document is served with relevant CORS headers.
This is due to same origin policy.
As you have a local WAMP server, there is no problem : simply open your file using a http://
URL like you do for your JSON file.
本文标签: Javascript can39t load JSON file from localhostStack Overflow
版权声明:本文标题:Javascript: can't load JSON file from localhost - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1744574075a2613514.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论