Question

我将angularjs与ui-router库一起使用。假设我有一些管理员路由和一些用户路由。如果管理员或用户已登录，我想为他们显示一些页面（例如admin.html for admin和user.html for user），否则login.html

在后端我有一个特殊的网址，比如/ auth / status /，它会向我提供有关用户的信息（如果他已登录以及他有哪个角色）

在某些情况下，我无法弄清楚如何处理：

我去'/'url。应用程序加载。我的app模块有一个run方法。但是，当异步发生时，如何检查用户是否已登录？好吧，我有这个并且它以某种方式工作，但我不确定这是否是一个很好的解决方案：

    app.config(['$stateProvider', '$routeProvider',
    function($stateProvider, $routeProvider) {
        $stateProvider
            .state('admin', {
                abstract: true,
                url: '/',
                templateUrl: 'templates/admin.html'
            })
            .state('admin.desktop', {
                url: 'desktop',
                templateUrl: 'templates/desktop.html'
            });
    }]);


    app.run([
    '$http', 
    '$rootScope', 
    '$location', 
    '$state', 
    'userRoles',
    function($http, $rootScope, $location, $state, userRoles) {
        var DEFAULT_ADMIN_STATE      = 'admin.desktop';

        var promise = $http.get('/auth/status/');

        promise.then(function(response) {
            $rootScope.isLogged = response.data.logged;
            $rootScope.userRole = userRoles[response.data.role];

            if (!$rootScope.isLogged) {
                $state.transitionTo('login');
            } else {
                switch (response.data.role) {
                    case 'admin': $state.transitionTo(DEFAULT_ADMIN_STATE);      break;
                }
            }
        }, function(response) {
            $location.path('/login');
        });
}]);

虽然我不明白：如果我去/ url我应该得到一个错误，因为它是抽象的。相反，当$ http.get请求被解决时（我在后端放置2秒睡眠来检查）我转换到admin.desktop状态。我很困惑会发生什么顺序：状态加载模板或app.run函数与一些ajax请求......

主要问题是，当我转到/＃/ desktop时，我如何首先检查用户是否已记录（向/ admin / auth /发送请求并检查它返回的内容）然后才决定要做什么（转换）登录或桌面状态）？我发现Delaying AngularJS route change until model loaded to prevent flicker这个，但对我来说仍然有点模糊。当我想加载实体列表然后显示模板时，Resolve属性似乎是一个解决方案。但我想为所有状态设置一些“之前”功能，只检查用户是否已登录并具有相应的角色（一时：我不想使用/ admin / entites或/ user / entities网址，想要只拥有/权利。当我得到它时，几个州可能有相同的网址）。所以基本上看起来如果我去/ someurl我想运行方法等待，直到它获得ajax响应并在转换到某个状态之后。而是对应于/ someurl的状态加载模板...

我还发现了一篇关于角度认证的文章，但作者使用的cookie不是异步的东西

更新：当我使用Cookie检查用户是否已登录时，我转到/＃/ desktop我仍然会渲染它，并且$ state.transitionTo无法正常工作..

Answer 1

您应该在页面加载前检查它：

我现在不能写完整的例子，但一般来说你应该这样做：

.run([ ..., function(....) {
    $scope.$on('$routeChangeStart', function(next, current) { 
        ... check cookie here ...
    });
}]);

在模板加载之前检查用户是否已登录

1 个答案: