SPA中AngularJS otherwise的redirectTo失效问题求助

我来帮你捋捋这个AngularJS里默认路由跳转失效的问题～你遇到的情况很典型，通常不是otherwise的写法问题，而是路由配置的依赖、模式或者路由顺序出了问题，下面给你一步步排查的思路：

1. 先确认ngRoute模块是否正确引入并依赖 #

这是最容易踩的坑！如果你的主模块没有声明依赖ngRoute，整个路由系统根本不会工作，otherwise自然也不会触发。

• 首先，确保HTML里加载了angular-route.js，顺序必须在angular.js之后：

  <script src="angular.js"></script>
  <script src="angular-route.js"></script>
  

• 然后，你的主模块定义必须包含ngRoute依赖：

  var app = angular.module('yourAppName', ['ngRoute']);
  

2. 检查是否启用了HTML5模式 #

如果你开启了HTML5路由模式（去掉URL里的#），但服务器端没配置fallback规则，就会导致直接访问不存在的路由时，服务器返回404，AngularJS根本没机会执行otherwise的重定向。

• 如果你用了这段配置：

  app.config(function($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true);
    // ... 其他路由配置
  });
  

  那必须给服务器加fallback配置，让所有不存在的路径都指向index.html：
  • Nginx示例：

    server {
      listen 80;
      root /path/to/your/spa;
      location / {
        try_files $uri $uri/ /index.html;
      }
    }
    

  • Apache示例：

    RewriteEngine On
    RewriteBase /
    RewriteRule ^index\.html$ - [L]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.html [L]
    

  • 要是不想折腾服务器，直接关掉HTML5模式，用默认的哈希路由，otherwise应该就能正常工作了。

3. 排查是否有宽泛路由抢占了otherwise #

如果你的路由列表里有类似.when('/:param', { ... })这种匹配范围极广的路由，它会优先匹配所有单段路径（比如/about、/test），导致otherwise永远不会被触发。

• 解决办法：把具体的路由放在前面，宽泛的路由放在最后，或者修改路由规则让它更精确（比如.when('/users/:id', ...)）。

4. 用极简示例测试排除干扰 #

如果上面的步骤都没解决问题，建议写一个最简的测试代码，排除项目里其他代码的干扰：

<!DOCTYPE html>
<html ng-app="testApp">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular-route.min.js"></script>
</head>
<body>
  <div ng-view></div>
  <script>
    var app = angular.module('testApp', ['ngRoute']);
    app.config(function($routeProvider) {
      $routeProvider
        .when('/', {
          template: '<h1>首页</h1>'
        })
        .otherwise({ redirectTo: '/' });
    });
  </script>
</body>
</html>

访问比如http://localhost/test，如果这个示例能正常跳转到首页，那问题肯定出在你项目里的其他代码（比如控制器、指令、其他路由冲突）。

内容的提问来源于stack exchange，提问作者user1751287