Loading JSON FILES,Ajax

1

HI GUYS I NEED YOUR HELP.

THIS IS MY CODE

   <!DOCTYPE html>
<html>
<head>
 <script src="AJAX/js/jquery-3.2.1.js"></script>
 <script>
 $(function() {
  $.ajax({
    type: 'GET',
	url : 'file:///C:/Users/dudko/Desktop/AJAX/JS/JSON_TEST.json',
	success: function(data) {
	 console.log('success',data);
	 }
	 });
	 });
	
</script>
</head>
<body>
<h1 class="test">Test Ajaxu a Jquerry</h1>
<button class="test" id="button" name="button">Zobraz</button>
<p class="test"id="demo">Toto je prvy paragraf</p>
<p class="test">Toto je druhy paragraf</p>
<div id="skuska"></div>
</body>
</html>

and i made a json file:

  {"name" : "test", "id" : 1}

And i try to learn AJAX and i want load this file from my computer and load it to my test page, in my computer. Can you sombody help me, how can i load json files?

2

You may have misspelled success.

1 Like
3

ok i edited but i still receiveing this message:

jquery-3.2.1.js:9566 XMLHttpRequest cannot load file:///C:/Users/dudko/Desktop/AJAX/JS/JSON_TEST.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

4

How about using a relative URL? Like AJAX/JS/JSON_TEST.json

5

Still the same…:confused: still the same message…i don t know what should i do…

6

Try adding dataType: 'json' in the ajax options.

7

Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension

still

8

Use jsonp in your request, lookup how to use it on net. jsonp allows crossorigin requests.
Useful link : https://learn.jquery.com/ajax/working-with-jsonp/

9

I tried your code on my laptop and I got results with this code:

$(function() {
  $.ajax({
    type: 'GET',
    url: 'AJAX/js/JSON_TEST.json', // js is lowercase!
    dataType: 'json',
    success: function(data) {
      console.log('success',data);
    }
  });
});

Both the jQuery file and the json file are in the AJAX/js directory. I’m not using Windows so I can’t try if url is case-insensitve. Double-check your files’ and directories’ capitalizations.

10

But i think, when i try to load from my computer, it s not type of url which web browser support, because i always in my console get error thath it can be possible in http,https schemas …but i try put link from another web site and it works!!! without jsonp

11

Yes because it’s different origin request. You use jsonp just for cross origin requests.

12

I’m pretty sure chrome has a built in security mechanism which prevents you from loading files from your local disk. Are you hosting your .html & .json file in a webserver locally, or are you just trying to drag-n-drop that .html file into your browser? If you are doing the second, you may need to start a chrome browser using --allow-file-access-from-files.