AngularJS：html5Mode(true) 导致 404 错误答案

【问题标题】：AngularJS: html5Mode(true) causing 404 errorAngularJS：html5Mode(true) 导致 404 错误
【发布时间】：2014-02-23 20:05:23
【问题描述】：

我正在尝试使用 $locationProvider.html5Mode(true) 删除我的应用程序上的 # 标记。它去掉了 #，但现在我得到了 404 errors 的所有观点。

angular.module('myApp', ['ngRoute']).
  config(['$routeProvider','$locationProvider', function($routeProvider, $locationProvider) {
    $routeProvider.when('/', { templateUrl: 'views/home.html', controller: 'homeCtrl' });
    $routeProvider.when('/about', { templateUrl: 'views/about.html', controller: 'aboutCtrl' });

    $locationProvider.html5Mode(true);

}]);

【问题讨论】：

没有区别

标签： angularjs

【解决方案1】：

事实证明，如果有人使用$locationProvider.html5Mode(true)。您必须设置一个基本网址（<base href="/appFolder/" />）...according to this answer

【讨论】：

使用此模式需要在服务器端重写 URL，基本上你必须重写所有指向应用程序入口点的链接

【解决方案2】：

对于 .net 项目，您还需要在 Web 配置中添加重写规则。将以下代码添加到 web.config 并在单页部分的头部添加 href 是您单页的路径

<system.webServer>    <rewrite>
<rules>
  <rule name="RewriteRules" stopProcessing="true">
    <match url=".*" />
    <conditions logicalGrouping="MatchAll">
      <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
      <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
      <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
    </conditions>
    <action type="Rewrite" url="/index.html" />
  </rule>
</rules>  </rewrite></system.webServer>

【讨论】：