AngularJS |使用无权查看页面时重定向到MainRoute答案

【问题标题】：AngularJS | Redirect to MainRoute when use does not have permission to see the pageAngularJS |使用无权查看页面时重定向到MainRoute
【发布时间】：2019-05-22 19:42:14
【问题描述】：

我正在使用多层身份验证系统和我的 AngularJS 应用程序（Angular 1.6.4）。

意思是一个用户有多个权限。根据他拥有的权限，他可以看到或看不到权限适用的页面。

我已经设法根据权限级别隐藏有关该屏幕的所有必要 HTML 元素。但是现在我在保护路线本身时遇到了一些问题。

基本上，如果用户在登录时提供给他的权限数组中不包含他拥有的权限，我希望用户重定向到我的登录页面。

这是我所做的：

  $rootScope.$on("rebalancing", () => {
    if (user.permissions !== Role.ViewConnectors || user.permissions !== 
       Role.ManageConnectors) {
      redirectTo(application.APP)
    }
  });

但它似乎没有做任何事情。你能帮我么。我了解此操作需要在其他所有操作之前进行检查。所以，rootScope 似乎是一个不错的起点。

更多信息 用户由我正在传递的 ReduxStore 提供。 application.APP 是应用程序的主路由。而redirectTo，是redirectTo(/etc...)的自定义实用程序

【问题讨论】：

通常在路由配置中使用解析函数来中止加载未经授权的路由。

标签： javascript angularjs redirect angularjs-directive

【解决方案1】：

在Angular2+中有RouteGuards，在AngularJS中你可以使用类似的解决方案，前提是你使用的是uiRouter

在你的状态下添加一个解析函数来检查用户是否有正确的权限，如果没有则返回一个被拒绝的承诺

    resolve: {
       security: ['$q', function($q, Auth){
           // Checking permission here, you can pass the resource or some other 
           // data is necessary
           if(!Auth.isAllowed()){
              return $q.reject("Not Authorized");
           }
       }]

这将避免控制器加载。要重定向到您的landingPage，请在您的应用程序运行函数中添加此侦听器

        $rootScope.$on('$stateChangeError', function(e, toState, toParams, fromState, fromParams, error){

            if(error === "Not Authorized"){
                $state.go("landingPageOrWherever");
            }
        });

我已经测试过了，它正在工作。

正如已经回答的here

【讨论】：