Read json file from localhost with javascript

Question

I need to read a .json file from my localhost, but it didn't work!

The contents of the file are as follows:

[
 {"source":"tw1", 
  "text":"fubar"}, 

 {"source":"tw2", 
  "text":"foo"}
]

I set up the localhost with the command: python -m http.server 8888 &, which is posted D3.js here.

I wrote the following javascript code:

<script type="text/javascript" src="lib/jquery-1.9.1.js"></script>
   <script>
    $(document).ready(
        $.getJSON("http://localhost/test.json", function(data){
            document.write(data);

    });
    </script>

Refer stackoverflow.com/questions/7346563/loading-local-json-file.. it may help you — Nishu Tayal
– Nishu Tayal, Commented Mar 29, 2013 at 12:18
I agree with @Amberlamps. Please edit the question and show the error you are getting. — Jess
– Jess, Commented Mar 29, 2013 at 12:31
Sry i get no error, i get nothing, thats one of the problems — dot
– dot, Commented Mar 29, 2013 at 12:45

Denys Séguret · Accepted Answer · 2013-03-29 12:37:25Z

4

If you open your server on port 8888, then you must request it on that port :

$.getJSON("http://localhost:8888/test.json", function(data){

But beware that the server must set the correct CORS headers if you want to be able to pass cross domain restrictions.

A third problem is that your code can't compile : you're missing a });. The indentation asymmetry makes it obvious :

$(document).ready(
    $.getJSON("http://localhost:8888/test.json", function(data){
        document.write(data);
    }); // <=== was missing
});

A fourth problem is that you wan't use document.write once the page is loaded. You must write using DOM manipulation methods, like $(document.body).append($('<pre>'+data+'</pre>'));

edited Mar 29, 2013 at 12:37

answered Mar 29, 2013 at 12:17

Denys Séguret

384k90 gold badges813 silver badges779 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

dot Over a year ago

Thanks for the fast reply, where is the }); missing, this is above the </script> tag or not?

Denys Séguret Over a year ago

@dot I edited. You should try to get used to see symmetry in the code. That's how I spot most obvious errors.

dot Over a year ago

How can i set the correct CORS headers, on this simple server, sry the silly question!

Erick Mg · Accepted Answer · 2017-02-26 07:44:06Z

1

I think the problem is that you're trying to access the json file in your computer, upload your json file to a online server and access that instead of the one that is one your computer.

answered Feb 26, 2017 at 7:44

Erick Mg

411 silver badge3 bronze badges

Collectives™ on Stack Overflow

Read json file from localhost with javascript

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related