Question

我知道这个问题已被多次讨论过，但解决方案并不符合我的要求。任务很简单。如果用户未登录，则应将用户重定向到登录页面。当我在$ on中执行它时，它会产生无限循环。让我知道什么是最好的解决方案。

    var adminpanel = angular.module('administrator', ['ngMessages','ui.router','ui.bootstrap','ngCookies']);
    adminpanel.config(function ($stateProvider, $urlRouterProvider) {
    //    $urlRouterProvider.otherwise("/login");
        $urlRouterProvider.otherwise( function($injector, $location) {
                var $state = $injector.get("$state");
                $state.go("login");
            });
                $stateProvider
                .state('login', {
                                url: "/login",
                                controller:"userCtrl",
                                templateUrl: "views/login.tpl.html",
                                permissions:{except:['admin']}
                                }
                      )
                  .state('menu', {
                                templateUrl: "views/menu.tpl.html",
                                controller:'adminCtrl',
                                permissions:{allow : ['admin']}
                                }
                      )
                  .state('menu.dashboard', {
                                url: "/dashboard",
                                templateUrl: "views/dashboard.tpl.html",
                                permissions:{allow : ['admin']}
                                }
                      )

});


adminpanel.run([ '$rootScope', '$state', '$stateParams','$cookieStore',function ($rootScope, $state, $stateParams,$cookieStore) {
 $rootScope.$state = $state;
    $rootScope.$stateParams = $stateParams;
        $rootScope.$on('$stateChangeStart',function(event, toState, fromState){

            if($rootScope.session == undefined && $cookieStore.get('name') == undefined){$rootScope.session={}}
            else if($rootScope.session == undefined && $cookieStore.get('name') != undefined){
                    $rootScope.session={set:true, name : $cookieStore.get('name'), userid :$cookieStore.get('userid'), role:$cookieStore.get('role')};
            };
        //Added below lines as update    
             if(toState.name === "login"){
              return;
            }
        //Added above lines as update
        var authorized = true;
         if(Object.keys($rootScope.session).length === 0){
              event.preventDefault();
            $state.go('login');
         }
        else if(Object.keys(toState.permissions).length !=0){
                    console.log($rootScope.session.role);
                    angular.forEach(toState.permissions, function(value,key){
                     angular.forEach(value,function(role){
                        if(key === 'except' && role === $rootScope.session.role)
                        {authorized = false;}
                        else if(key === 'allow' && role !== $rootScope.session.role)
                        {authorized = false;};
                    });
                });
}
if(!authorized){
                        event.preventDefault();
                        $state.go('menu.dashboard');
                };

        });

}]);

提前感谢您的帮助。

更新1：

解决方案正常。但是，如果用户已登录，则用户在尝试通过地址栏查看时不应访问登录页面。所以我创建了一个权限参数，除了键。

但是如果用户通过地址栏点击登录页面，则会生成登录页面，不应该将登录页面重定向到menu.dashboard。

希望我很清楚。

Answer 1

这里的重点是避免重定向，如果已经发生，如果已经重定向：

...
// never redirect to state, if already going there
if(toState.name === "login"){
  return;
}

// evaluate some IF here only if we go to other state then login
if(Object.keys($rootScope.session).length === 0) {
  event.preventDefault();
  $state.go('login');
  return;

}

Answer 2

更改了if循环，它可以根据需要运行。以下是工作代码。

if(Object.keys($rootScope.session).length === 0){
             if(toState.name === "login"){
              return;
            }
             else{
              event.preventDefault();
            $state.go('login');
             }
         }
        else if(Object.keys(toState.permissions).length !=0){

                    angular.forEach(toState.permissions, function(value,key){
                     angular.forEach(value,function(role){
                        if(key === 'except' && role === $rootScope.session.role)
                        {authorized = false;}
                        else if(key === 'allow' && role !== $rootScope.session.role)
                        {authorized = false;};
                    });
                });
           };
        if(!authorized){
                    event.preventDefault();
                    $state.go('menu.dashboard');
            };

angularjs ui-router生成无限循环

2 个答案: