Geek Answers Handbook

Error: Failed to execute 'send' on 'XMLHttpRequest': Could not load file ': AngularJS SPA

I am very new to Angular SPA, and the first time I get code from Google and try to run. But I get some errors in the console. I could not understand why, I found a list of the following console errors:

XMLHttpRequest cannot load File: /// C: /Users/hp/Downloads/single-page-app-angularjs-master/home.html. Cross-start requests are supported only for protocol schemes: http, data, chrome, chrome extension, https, chrome-extension-resource.

Error: Could not execute 'send' in 'XMLHttpRequest': Could not load 'File: /// C: /Users/hp/Downloads/single-page-app-angularjs-master/home.html. XMLHttpRequest cannot load File: /// C: /Users/hp/Downloads/single-page-app-angularjs-master/about.html. Cross-start requests are supported only for protocol schemes: http, data, chrome, chrome extension, https, chrome-extension-resource.

Error: [$ compile: tpload] http://errors.angularjs.org/1.3.3/ $ compile / tpload? p0 = home.html

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Single page web app using Angularjs</title> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular-route.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> <script src="script.js"></script> </head> <body ng-app="single-page-app"> <div ng-controller="cfgController"> <div> <nav class="navbar navbar-inverse" role="navigation" style="padding-left:130px;"> <ul class="nav navbar-nav"> <li class="active"><a href="#/">Home<span class="sr-only">(current)</span></a></li> <li><a href="#/about">About us</a></li> <li><a href="#/about">Read tutorial</a></li> </ul> </nav> </div> <br/> <div ng-view class="jumbotron"></div> </div> </body> </html>
+7
javascript jquery angularjs single-page-application
source share
2 answers

On Windows:

 chrome.exe --allow-file-access-from-files

or

 chrome.exe --allow-file-access-from-files --disable-web-security

On Mac:

 open /Applications/Google\ Chrome.app/ --args --allow-file-access-from-files
+12
source

i ran into something Similarly and decided using an application server like Glassfish ...

in other words, using the http:// protocol instead of file://

+1
source

More articles:


All Articles