Angular SPAが初めてで、初めてGooglingからコードを取得して実行しようとしました。しかし、コンソールでいくつかのエラーが発生しました。理由がわかりませんでした。次のコンソールエラーのリストが見つかりました:
XMLHttpRequestはfile:/// C:/Users/hp/Downloads/single-page-app-angularjs-master/home.htmlを読み込めません。クロスオリジンリクエストは、プロトコルスキーム(http、data、chrome、chrome-extension、https、chrome-extension-resource)でのみサポートされています。
エラー:「XMLHttpRequest」で「送信」を実行できませんでした:「file:/// C:/Users/hp/Downloads/single-page-app-angularjs-master/home.html」をロードできませんでした。 XMLHttpRequestはfile:/// C:/Users/hp/Downloads/single-page-app-angularjs-master/about.htmlを読み込めません。クロスオリジンリクエストは、プロトコルスキーム(http、data、chrome、chrome-extension、https、chrome-extension-resource)でのみサポートされています。
エラー:[$ 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>
Windowsの場合:
chrome.exe --allow-file-access-from-files
または
chrome.exe --allow-file-access-from-files --disable-web-security
Macの場合:
open /Applications/Google\ Chrome.app/ --args --allow-file-access-from-files
私はそのような何かに直面し、Glassfish
のようなアプリケーションサーバーを使用して解決しました...
つまり、http://
プロトコルの代わりにfile://