0

I have made some project which sends XHR request to fetch a locally saved JSON file (the file being in the same folder). I use VS Code with 'live server' extension. The request, response and every thing else works perfectly fine when I open the html file with Live Server. But when I open the file without starting any kind of local server, then the request doesn't return any response and instead logs out an error-

(I am using Chrome)

Access to XMLHttpRequest at 'file:///G:/_PROJECTS/Graph%20Plotter/sample_data.json' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

I searched online about this and found some google documentation but didn't quite understand it. I want to know what the error is about and how can I fix it? Also I would be great help if you could simplify it so that I understand it.

Thanks in advance!

Mehul
  • 216
  • 2
  • 10
  • `XMLHttpRequest` no longer requires XML but it certainly needs http. – Álvaro González May 16 '20 at 16:33
  • @ÁlvaroGonzález What do you mean by that? Like is there any syntax change? idk..please be clear... – Mehul May 16 '20 at 16:42
  • 1
    An XHR request is a **network** request. You cannot use to load stuff from the file system (your computer's hard disk). – Álvaro González May 16 '20 at 16:46
  • Would also be a security risk, i.e. `fetch file from disk -> put into HTML form -> submit form automatically to attacker's server` – Ulrich Thomas Gabor May 17 '20 at 08:25
  • Oh now I get it...Thanks Alvaro and GhostGambler. That certainly would be a security threat. – Mehul May 17 '20 at 11:15
  • But how can I load local JSON files in JavaScript? Is there any way? I can upload it on the internet and them fetch it. That'd be okay for me but still I'm curious. Is there still any way JavaScript can interact with local files - since it was created solely to prevent web scripts from interacting with client-side files...? – Mehul May 17 '20 at 11:18
  • Network is not synonymous with internet. What are you trying to do exactly? Have a public web site that fetchs data from other people's computers? Or have a private local application running in your own PC for your own use? – Álvaro González May 17 '20 at 11:56
  • private local application running in my own PC for my use – Mehul May 17 '20 at 15:55
  • You need an HTTP server pointing to `localhost` (which is your own machine). There're many to choose from: Apache, Nginx, IIS... Even PHP includes a [toy server](https://www.php.net/manual/en/features.commandline.webserver.php). – Álvaro González May 17 '20 at 18:02
  • ooh. Okay now I get it...Thanks to all ! – Mehul May 18 '20 at 03:54
  • Does this answer your question? [Cross-origin request for local file](https://stackoverflow.com/questions/43493323/cross-origin-request-for-local-file) – Joundill May 18 '20 at 04:36

1 Answers1

0

I need to have a HTTP server point to my localhost to be able to fetch files locally. Since XHR needs a network to send HTTP requests, I cannot simply fetch local files without being on any network/server (either internet or local server). The resulting chrome error is due to the fact that chrome has disabled fetching local files without being on any network due to security and privacy concerns

Mehul
  • 216
  • 2
  • 10