AngularJS 路由在直接链接时不起作用 - 使用 html5 模式和 Firebase 重写

Question

当通过地址栏直接访问 url 或从其他地方直接访问 link 时，我的 Angular 应用程序出现路由问题 - 所有地址都恢复为主页。

但是，当通过应用程序中的 link 访问时，路由工作正常。

已经有几个类似的问题

AngularJS HTML5Mode

Angular routing doesn't work when URL is directly visited in browser but works when clicked to?

据我了解，Angular 代码在直接访问时不会运行，因为页面在应用程序代码运行之前呈现，因此服务器端重写需要发生指向index.html 的浏览器，此时应用程序运行和路线被拾取。

我正在使用具有重写规则的 Firebase 托管。

但是我已经按照上面列出的修复程序以及网站上的其他地方进行了修复，但我仍然遇到问题。

我的路线是这样的：

app.js

.config(function($routeProvider, $locationProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'views/posts.html',
            controller: 'PostsCtrl'
        })
        .when('/posts/:postId', {
            templateUrl: 'views/postview.html',
            controller: 'PostViewCtrl'
        })
        .when('/new', {
            templateUrl: 'views/new-post.html',
            controller: 'AddPostCtrl'
        })
        .when('/register', {
            templateUrl: 'views/register.html',
            controller: 'AuthCtrl',
            resolve: {
                user: function(Auth) {
                    return Auth.resolveUser();
                }
            }
        })
        .when('/login', {
            templateUrl: 'views/login.html',
            controller: 'AuthCtrl',
            resolve: {
                user: function(Auth) {
                    return Auth.resolveUser();
                }
            }
        })
        .when('/edit-profile', {
            templateUrl: 'views/edit-profile.html',
            controller: 'EditProfileCtrl',
            resolve: {
                user: function(Auth) {
                    return Auth.resolveUser();
                }
            }
        })
        .when('/change-password', {
            templateUrl: 'views/change-password.html',
            controller: 'ChangePasswordCtrl',
            resolve: {
                user: function(Auth) {
                    return Auth.resolveUser();
                }
            }
        })
        .when('/@:userId', {
            templateUrl: 'views/profile.html',
            controller: 'ProfileCtrl',
            resolve: {
                user: function(Auth) {
                    return Auth.resolveUser();
                }
            }
        })
        .when('/users/:userId', {
            templateUrl: 'views/profile.html',
            controller: 'ProfileCtrl',
            resolve: {
                user: function(Auth) {
                    return Auth.resolveUser();
                }
            }
        })
        .when('/search', {
            templateUrl: 'views/search.html',
            controller: 'SearchCtrl'
        })
        .otherwise({
            redirectTo: '/'
        });
    $locationProvider.html5Mode(true);
})

我的firebase重写规则如下

firebase.json

"rewrites": [ {
    "source": "**",
    "destination": "/index.html"
          } ]

我的 <head> 中也有 <base href="/">，如 Angular 文档中针对 HTML5 模式

所述

我已联系 Firebase，他们已确认重写在应用程序上正常运行。

注意： 我还应该说，当运行在本地没有应用程序时，我也遇到了这个问题HTML5 模式（因此在 URL 中使用 /#/）。

我做错了什么？我假设这一定与我的路由有关。我已经尝试更改我的 'otherwise' 以转到另一条路线以查看是否是发现此错误的地方，但它仍然返回到主页。

非常感谢这里的任何帮助，非常感谢。

Answer 1

是啊，所以我是个白痴。我在重定向到“/”的服务中发现了一段流氓代码。抱歉

AngularJS 路由在直接链接时不起作用 - 使用 html5 模式和 Firebase 重写

AngularJS routes not working when linked directly - Using html5 mode and Firebase rewrites

javascript

url-rewriting

angularjs

firebase

angularjs-routing

app.js

firebase.json