ui-路由器解析 vs.运行 安全

Question

我很好奇其他人在应用程序的路由安全方面做了什么。起初我们通过从 angular

中的 .运行 方法调用我们的安全服务来实现我们的安全

app.run(function ($rootScope, $state, SecuirtyService){ 
SecurityService.initSecurity().then(function(data){}); }

SecurityService.initSecurity 然后会进行休息调用以查看用户拥有哪些权限。问题在于，由于 .initSecurity returns 承诺应用程序的其余部分将执行，直到 $http 决定执行调用因此加载 UI 而安全检查尚未完成。

因此，为了解决这个问题，在我们的 ui-router 中，我为我们的每个状态添加了一个 resolve。这确保我们的 .initSecurity 在加载控制器之前得到满足。

Header: {
          templateUrl: "header/headerBar.html",
          controller: "HeaderController as headerCtrl",
          resolve: {
            security: function(SecurityService){
              return SecurityService.initSecurity();
            }
          }
        },

问题在于 .initSecurity 在每个页面加载之前被调用，这看起来非常多余。

在一个完美的世界中，.运行 方法在承诺实现之前不会完成，但 https://github.com/angular/angular.js/issues/4003 看起来这并没有发生。

我的问题是您如何对您的应用程序实施安全检查？您是否以某种方式从 .运行 方法中解雇了它？或者让它成为解决方案的一部分是一个有效的选择吗？

Answer 1

您可以使用 deferIntercept 暂停初始路由，直到异步检查完成。然后使用listen和sync开始路由。

myapp.config(function ($urlRouterProvider) {
  $urlRouterProvider.deferIntercept();
})

myapp.run(function (SecurityService, $urlRouter) {
  SecurityService.initSecurity()
  .then(function(data){
    $urlRouter.listen();
    $urlRouter.sync();
  });
});

Answer 2

您可以创建父状态（我们称之为 auth）并从那里解决安全问题。

$stateProvider
 .state('auth', {
  abstract: true,
  resolve: {
   security: function(SecurityService) {
     // Will resolve once if transferring between auth states
     return SecurityService.initSecurity(); 
   }
  }
 })
 .state('auth.profile', {
  ...
 });