Cross origin requests are only supported for HTTP but it s not cross-domain

Question

I m using this code to make an AJAX request       userBarSignup   click function          get  C  xampp htdocs webname resources templates signup php              params             function response                   signup   html  TEST                    signup   html response                       html      But from the Google Chrome JavaScript console I keep receiving this error      XMLHttpRequest cannot load   file    C  xampp htdocs webname resources templates signup php  Cross   origin requests are only supported for HTTP    The problem is that the signup php file is hosted on my local web server that s where all the website is run from so it s not cross-domain   How can I solve this problem

User · Answer

You can also start a server without python using php interpreter.

E.g:

cd /your/path/to/website/root
php -S localhost:8000

This can be useful if you want an alternative to npm, as php utility comes preinstalled on some OS' (including Mac).

User · Answer

It works best this way  Make sure that both files are on the server  When calling the html page  make use of the web address like  http    localhost myhtmlfile html  and not  C     users myhtmlfile html  Make usre as well that the url passed to the json is a web address as denoted below     function                        typeahead   typeahead                       source  function query  process                             ajax                               url   http   localhost 2222 bootstrap source php                               type   POST                               data   query    query                              dataType   JSON                               async  true                              success  function data                                   process data

User · Answer

I ve had luck starting chrome with the following switch   --allow-file-access-from-files   On os x try  re-type the dashes if you copy paste    open -a  Google Chrome  --args -allow-file-access-from-files   On other  nix run  not tested    google-chrome  --allow-file-access-from-files   or on windows edit the properties of the chrome shortcut and add the switch  e g    C        Application chrome exe --allow-file-access-from-files   to the end of the  target  path

User · Answer

If you have nodejs installed  you can download and install the server using command line   npm install -g http-server   Change directories to the directory where you want to serve files from      cd   projects angular current project    Run the server     http-server    which will produce the message Starting up http-server  serving on    Available on    http   your ip 8080 and    http   127 0 0 1 8080  That allows you to use urls in your browser like      http   your ip 8080 index html

User · Answer

If you   re working on a little front-end project and want to test it locally  you   d typically open it by pointing your local directory in the web browser  for instance entering file    home erick mysuperproject index html in your URL bar  However  if your site is trying to load resources  even if they   re placed in your local directory  you might see warnings like this   XMLHttpRequest cannot load  file    home erick mysuperproject mylibrary js  Cross origin requests are only supported for HTTP    Chrome and other modern browsers have implemented security restrictions for Cross Origin Requests  which means that you cannot load anything through  file       you need to use http    protocol at all times  even locally -due Same Origin policies  Simple as that  you   d need to mount a webserver to run your project there   This is not the end of the world and there are many solutions out there  including the good old Apache  with VirtualHosts if you   re running several other projects   node js with  express  a Ruby server  etc  or simply modifying your browser settings   However there   s a simpler and lightweight solution for the lazy ones  You can use Python   s SimpleHTTPServer  It comes already bundled with python so you don   t need to install or configure anything at all   So cd to your project directory  for instance  1 cd  home erick mysuperproject and then simply use  1 python -m SimpleHTTPServer And that   s it  you   ll see this message in your terminal  1 Serving HTTP on 0 0 0 0 port 8000     So now you can go back to your browser and visit http   0 0 0 0 8000 with all your directory files served there  You can configure the port and other things  just see the documentation  But this simply trick works for me when I   m in a rush to test a new library or work out a new idea   There you go  happy coding   EDIT  In Python 3   SimpleHTTPServer has been replaced with http server  So In Python 3 3  for example  the following command is equivalent   python -m http server 8000

User · Answer

You need to actually run a webserver  and make the get request to a URI on that server  rather than making the get request to a file  e g  change the line         get  C  xampp htdocs webname resources templates signup php     to read something like         get  http   localhost resources templates signup php     and the initial request page needs to be made over http as well

User · Answer

REM kill all existing instance of chrome  taskkill  F  IM chrome exe  T REM directory path where chrome exe is located set chromeLocation  C  Program Files  x86  Google Chrome Application  cd  chromeLocation  cd c  start chrome exe --allow-file-access-from-files    change chromeLocation path with yours   save above as  bat file  drag drop you file on the batch file you created   chrome does give restore pages option though so if you have pages open just hit restore and it will work

User · Answer

For all python users  Simply go to your destination folder in the terminal  cd projectFoder  then start HTTP server For Python3   python -m http server 8000  Serving HTTP on    port 8000  http        8000       go to your link  http   0 0 0 0 8000  Enjoy

User · Answer

I was getting the same error while trying to load simply HTML files that used JSON data to populate the page  so I used used node js and express to solve the problem  If you do not have node installed  you need to install node first    Install express npm install express Create a server js file in the root folder of your project  in my case one folder above the files I wanted to server Put something like the following in the server js file and read about this on the express gihub site   var express   require  express    var app   express    var path   require  path          dirname will use the current path from where you run this file  app use express static   dirname    app use express static path join   dirname    FOLDERTOHTMLFILESTOSERVER       app listen 8000   console log  Listening on port 8000     After you ve saved server js  you can run the server using    node server js   Go to http   localhost 8000 FILENAME and you should see the HTML file you were trying to load

[javascript] Cross origin requests are only supported for HTTP but it's not cross-domain

Examples related to javascript