AngularJS:阻止用户访问某个状态

AngularJS: Preventing user from accessing a certain state

本文关键字：状态 访问 用户 AngularJS      更新时间：2023-09-26

我正在使用sails.js后端和angular前端构建一个应用程序。我试图阻止用户在未经授权的情况下访问管理控制页面。我已经找到了几个答案，但似乎没有一个完全有效。

目前在我的app.js中，我有

$stateProvider
.state('home', {
  url: "/home",
  templateUrl: "home/homeTemplate.html",
  controller: 'homeController'
})
.state('adminPage', {
  url: "/adminPage",
  templateUrl: "adminPage/adminTemplate.html",
  controller: 'adminPageController',
  resolve: {
    validate: function($q, $sails, $location) {
      var defer = $q.defer();
      $sails.get("/user/getCurrentUser")
          .success(function(response) {
            if (response.user.accessAdminPage) {
              defer.resolve();
            }
            else {
              defer.reject("Access blocked");
              $location.path('/');
            }
            return defer.promise;
          })
    }
  }
})

当前代码正在部分工作；目前的问题是，当未经授权的用户首先登录并登录主页，然后访问localhost:1337/#/adminPage时，他实际上到达了该页面。地址栏中的url更改为localhost:1337/#/home，但不会重定向用户。现在奇怪的是，当之后通过导航栏访问主页并试图再次访问管理页面时，用户会按预期重定向到主页（尽管在重新加载页面时会出现令人讨厌的"闪光"）。

对于其他人的提问，这种处理方式奏效了，我想知道我可能错过了什么，以及我目前的解决方案不起作用的原因。

您正在从成功函数返回promise，这永远不会起作用。您应该从success函数外部返回defered.promise（promise对象）。

代码

$stateProvider
.state('home', {
        url: "/home",
        templateUrl: "home/homeTemplate.html",
        controller: 'homeController'
    })
.state('adminPage', {
  url: "/adminPage",
  templateUrl: "adminPage/adminTemplate.html",
  controller: 'adminPageController',
  resolve: {
    validate: function($q, $sails, $location) {
      var defer = $q.defer();
      $sails.get("/user/getCurrentUser")
      .success(function(response) {
        if (response.user.accessAdminPage) {
          defer.resolve();
        } else {
          defer.reject("Access blocked");
          $location.path('/');
        }
      });
      return defer.promise;
    }
  }
});

希望这能帮到你，谢谢。

使用pankajparkar提供的解决方案，问题是您必须回复每个状态声明中的逻辑。我建议您在onStateChangeStart事件中检查用户的授权

angular.module('myApp', ['ui.router'])
  .run(function($rootScope, AuthService){
    $rootScope.$on('$stateChangeStart', 
      function(event, next, nextParams, prev, prevParams) {
        AuthService.isNotAutorized()
          .then(function() {
            event.preventDefault(); 
            $state.go('defaultState');
          });
    });
  });
相关文章：