XMLHttpRequest cannot load file: // ... Origin null not allowed Access-Control-Allow-Origin

I see that the above question was asked earlier, however, even after their appeal, I could not find a way for me, so I took the liberty of starting a new post for this question.

I have a getjson.html file containing the following code

<html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $.getJSON("json_data.txt",function(result){ $.each(result, function(i, field){ $("div").append(field + " "); }); }); }); }); </script> </head> <body> <button>Get JSON data</button> <div></div> </body> </html> 

Json_data.txt contains the following:

 { "firstName": "John", "lastName": "Doe", "age": 25 } 

When I open the getjson.html file in the browser, it gives an error:

"XMLHttpRequest cannot load the file: // ..... Origin null not allowed Access-Control-Allow-Origin."

Someone Please suggest a simple solution regarding this, how can I make this possible.

PS: I am writing a web application on the go.

+3
source share
2 answers

Do you directly open the HTML file? Then the file must be hosted on the web server and then executed. Browsers generally do not allow the use of the file:/// protocol for AJAX calls for security reasons.

+6
source

I read your problem a bit (spring 2013) and think I have found a solution to limit the cross domain of CORS XHR in the file: // context!

I put this header on my remote php script:

 header('Access-Control-Allow-Origin: '.$_SERVER['HTTP_ORIGIN']); 

and it works! More explanation here: Rannpháirtí anaithnid / CORS

Can it work instead of jQuery and jsonp application instead of "jQuery"?

0
source

All Articles