3

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

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

有一些情况我不知道如何处理：

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

    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 状态。我很困惑按什么顺序发生了什么：状态加载模板或带有一些ajax请求的app.run函数......

主要问题是，当我转到 /#/desktop 时，如何首先检查用户是否已登录（向 /admin/auth/ 发送请求并检查它返回的内容），然后才决定要做什么（过渡到登录或桌面状态）？我发现延迟 AngularJS 路由更改直到模型加载以防止闪烁这个，但对我来说还是有点模糊。当我想加载实体列表然后显示模板时，解析属性似乎是一种解决方案。但是我想为所有状态提供一些“之前”功能，它只检查用户是否已登录并具有相应的角色（有一刻：我不想使用 /admin/entites 或 /user/entities url，只想/entitites。据我所知，几个州可能有相同的网址）。所以基本上看起来如果我去 /someurl 我想运行方法等到它得到 ajax 响应，然后转换到某个状态。相反，与 /someurl 对应的状态会加载模板...

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

更新：当我使用 cookie 检查用户是否已登录并转到 /#/desktop 时，我仍然呈现它，并且 $state.transitionTo 不起作用..

4

1 回答 1

1

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

我现在不能写完整的例子，但通常你应该这样做：

.run([ ..., function(....) {
    $scope.$on('$routeChangeStart', function(next, current) { 
        ... check cookie here ...
    });
}]);
于 2013-07-31T08:58:27.323 回答