XMLHttpRequest cannot load file Cross origin requests are only supported for HTTP

Question

I am getting the following error   XMLHttpRequest cannot load file    C  Users richa agiwal Desktop get rm Library templates template viewSettings html  Cross origin requests are only supported for HTTP     I realize that this question has been answered before  but I still have not found a solution to my problem  I tried running chrome exe --allow-file-access-from-files from the command prompt  and moved the file to the local file system  but I still get the same error   I appreciate any suggestions

User · Answer

If you use the WebStorm Javascript IDE  you can just open your project from WebStorm in your browser  WebStorm will automatically start a server and you won t get any of these errors anymore  because you are now accessing the files with the allowed supported protocols  HTTP

User · Answer

Simple Solution  If you are working with pure html js css files   Install this small server link  app in chrome  Open the app and point the file location to your project directory    Goto the url shown in the app   Edit  Smarter solution using Gulp  Step 1  To install Gulp  Run following command in your terminal    npm install gulp-cli -g npm install gulp -D   Step 2  Inside your project directory create a file named gulpfile js  Copy the following content inside it   var gulp          require  gulp    var bs            require  browser-sync   create        gulp task  serve            gt            bs init               server                   baseDir                                   port  5000              reloadOnRestart  true              browser   google chrome                      gulp watch                bs reload          Step 3  Install browser sync gulp plugin  Inside the same directory where gulpfile js is present  run the following command  npm install browser-sync gulp --save-dev   Step 4  Start the server  Inside the same directory where gulpfile js is present  run the following command  gulp serve

User · Answer

Depends on your needs  but there is also a quick way to temporarily check your  dummy  JSON by saving your JSON on http   myjson com  Copy the api link and paste that into your javascript code  Viola  When you want to deploy the codes  you must not forget to change that url in your codes

User · Answer

This error is happening because you are just opening html documents directly from the browser  To fix this you will need to serve your code from a webserver and access it on localhost  If you have Apache setup  use it to serve your files  Some IDE s have built in web servers  like JetBrains IDE s  Eclipse     If you have Node Js setup then you can use http-server  Just run npm install http-server -g and you will be able to use it in terminal like http-server C  location to app  Kirill Fuchs

User · Answer

I was facing this error while I deployed my Web API project locally and I was calling API project only with this URL given below   localhost  myAPIProject  Since the error message says it is not http    then I changed the URL and put a prefix http as given below and the error was gone   http   localhost  myAPIProject

User · Answer

If you are doing something like writing HTML and Javascript in a code editor on your personal computer  and testing the output in your browser  you will probably get error messages about Cross Origin Requests   Your browser will render HTML and run Javascript  jQuery  angularJs in your browser without needing a server set up   But many web browsers are programed to watch for cross site attacks  and will block requests   You don t want just anyone being able to read your hard drive from your web browser   You can create a fully functioning web page using Notepad   that will run Javascript  and frameworks like jQuery and angularJs  and test everything just by using the Notepad   menu item  RUN  LAUNCH IN FIREFOX   That s a nice  easy way to start creating a web page  but when you start creating anything more than layout  css and simple page navigation  you need a local server set up on your machine   Here are some options that I use    Test your web page locally on Firefox  then deploy to your host  or  Run a local server   Test on Firefox  Deploy to Host   Firefox currently allows Cross Origin Requests from files served from your hard drive Your web hosting site will allow requests to files in folders as configured by the manifest file   Run a Local Server   Run a server on your computer  like Apache or Python Python isn t a server  but it will run a simple server   Run a Local Server with Python  Get your IP address    On Windows  Open up the  Command Prompt    All Programs  Accessories  Command Prompt I always run the Command Prompt as Administrator   Right click the Command Prompt menu item and look for Run As Administrator Type the command  ipconfig and hit Enter  Look for   IPv4 Address                 12 123 123 00 There are websites that will also display your IP address   If you don t have Python  download and install it   Using the  Command Prompt  you must go to the folder where the files are that you want to serve as a webpage    If you need to get back to the C   Root directory - type cd  type cd Drive  Folder Folder etc to get to the folder where your  Html file is   or php  etc  Check the path   type  path at the command prompt   You must see the path to the folder where python is located   For example  if python is in C  Python27  then you must see that address in the paths that are listed  If the path to the Python directory is not in the path  you must set the path   type  help path and hit Enter   You will see help for path  Type something like  path c  python27  path      path  keeps all your current paths   You don t want to wipe out all your current paths  just add a new path  Create the new path FROM the folder where you want to serve the files  Start the Python Server  Type  python -m SimpleHTTPServer port Where  port  is the number of the port you want  for example python -m SimpleHTTPServer 1337 If you leave the port empty  it defaults to port 8000 If the Python server starts successfully  you will see a msg    Run You Web Application Locally   Open a browser In the address line type  http   your IP address port http   xxx xxx x x 1337  or http   xx xxx xxx xx 8000 for the default If the server is working  you will see a list of your files in the browser Click the file you want to serve  and it should display    More advanced solutions   Install a code editor  web server  and other services that are integrated    You can install Apache  PHP  Python  SQL  Debuggers etc  all separately on your machine  and then spend lots of time trying to figure out how to make them all work together  or look for a solution that combines all those things   I like using XAMPP with NetBeans IDE   You can also install WAMP which provides a User Interface for managing and integrating Apache and other services

User · Answer

To add to Alan Wells s elaborate answer here is a quick fix Run a Local Server you can serve any folder in your computer with Serve First  navigate using the command line into the folder you d like to serve  Then npx i -g serve serve  or if you d like to test Serve without downloading it npx serve  and that s it  You can view your files at http   localhost 5000

[security] XMLHttpRequest cannot load file. Cross origin requests are only supported for HTTP

Examples related to security

Examples related to google-chrome