Can't open Angular app using file protocol in Chrome

Question

Hi i have a problem with angularjs and chrome, this is the code:

   var angularRoutingApp = angular.module(\'angularRoutingApp\', [\'ngRoute\'])

   // Confi         


        

Answer 1

you should have a web server running. opening it with file:// will enable protection in some browsers that will prevent you from running parts of the code, for example ajax calls.

The best solution is running a webserver, specially because angular comes with one. For example I use yeoman and I can run grunt serve. Moar here https://docs.angularjs.org/tutorial/step_00

Another option is setting up chrome to allow XHR with the file protocol Allow Google Chrome to use XMLHttpRequest to load a URL from a local file

Answer 2

Chrome uses a fairly stringent same-origin policy. There are two things you can do:

1) You should not normally develop from file://. Use MAMP, your built-in Apache web server or some other way to set up a local web server. If you are on a Mac, as I surmise from the path you provide, you can launch a very simple Python-based http server by opening up terminal and entering

$> python -m SimpleHTTPServer 8080

This will open a simple HTTP server on port 8080 from the folder you invoked it from.

2) You can, but you really should not, relax your safety settings for Chrome. This is possible, but generally bad practice.

Answer 3

In addition to @Chris vCB's answer, you can use php if you want instead with

php -S localhost:8080

(or whatever domain::port you wish)