AngularJs-将访问权限限制为“已登录”用户的最佳方法

Question

我正在努力为正在创建的应用设置登录系统。

我可以为用户登录或注销设置cookie。我认为，如果用户已登录，测试每个视图都不是一个非常优雅的解决方案，并且我担心这里和那里的页面可能会掉入裂缝（这是一个相当大的应用程序）。

我在想最好的方法是以某种方式拦截路由更改并检查用户是否已登录，否则将其发送到登录/创建用户页面。我发现了一些方法，但是似乎没有正式记录。有没有人在现实世界中使用过这种方法，并且有效吗？

我的路线文件如下所示：

'use strict';

app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
        // LOGIN
        .when('/User/LoginUser', {templateUrl: 'views/user/login.html',controller: 'loginCtrl'})

    ....... more routes here.......

        // DEFAULT
        .otherwise({redirectTo: '/'});
}]);

任何帮助或建议，或指向已记录的现实世界中有关如何执行此操作的示例，将不胜感激！

Answer 1

您可以使用以下示例作为依据来拦截建议的路由更改并采取相应的措施：

    $rootScope.$on('$routeChangeStart', function (event, next) {
        var userAuthenticated = ...; /* Check if the user is logged in */

        if (!userAuthenticated && !next.isLogin) {
            /* You can save the user's location to take him back to the same page after he has logged-in */
            $rootScope.savedLocation = $location.url();

            $location.path('/User/LoginUser');
        }
    });

另外，添加isLogin: true到登录页面的路由定义，如下所示：

$routeProvider
    // LOGIN
    .when('/User/LoginUser', {templateUrl: 'views/user/login.html',controller: 'loginCtrl', isLogin: true})

祝您项目顺利！