javascript - 使用 $cookies 和 $stateChangeStart 检查 sessionID exeeding maximum callstack

Question

我不太确定为什么会这样。我正在尝试监听我的 Angular 应用程序中的每个状态更改，如果用户不是 Auth，则将其推送回登录。我将他们加密的 sessionID 存储在一个 cookie 中，检查该 cookie 是否未定义并重定向用户……或者至少这就是我想要做的。我将为用户 Angular 色等使用 toState 和 toParams 参数，因此您现在可以忽略这些作为此任务的一部分。

任何反馈都会有所帮助。提前致谢!

.run(($rootScope, $state, $cookies) => {
      $rootScope.$on('$stateChangeStart', (evt, toState, toParams) => {
            if(!$cookies.get('SessionID')){
                evt.preventDefault();
                $state.go('login');
            }
        })
  })

Answer 1

由于您在每次状态更改时都执行此操作，因此您创建了一个无限循环。你可能会把它美化一点，但这应该会让你到达那里:

.run(($rootScope, $state, $cookies) => {
      $rootScope.$on('$stateChangeStart', (evt, toState, toParams) => {
            if(!$cookies.get('SessionID'))
               {
                if (toState.name !== "login") {
                evt.preventDefault();
                $state.go('login');
               }
            }
        })
  })

以上将帮助您入门，但随着您的前进，您会发现还有其他一些状态您希望允许在没有 cookie 或身份验证的情况下访问。处理此问题的最佳方法可能是使用您在每个状态上定义的自定义属性。所以当你定义你的状态时，你会做类似的事情:

.state('home', {url: '/home', templateUrl: 'views/home.html', authRequired: false}) 
.state('someSecureUrl', {url: '/someSecure.url', templateUrl: 'views/someSecureUrl.html', authRequired: true}) 

然后修改上面的代码如下:

.run(($rootScope, $state, $cookies) => {
          $rootScope.$on('$stateChangeStart', (evt, toState, toParams) => {
                if(!$cookies.get('SessionID')  && toState.authRequired)
                   {
                    evt.preventDefault();
                    $state.go('login');
                }
            })
      })

您还可以考虑在您的状态上使用解析函数来执行此操作。