Question

我有一个非常简单的要求。

我有3个用户角色：

CATUSER
LICUSER
ALLUSER
- 我在$rootScope.userRole变量中具有用户角色的值。
- 在AngularJS应用程序启动之前，我已经定义了用户角色，因为从PHP脚本调用了AngularJS应用程序，并且在PHP脚本中已经定义了用户角色。

现在，当AngularJS应用启动时，根据我想要的角色，我具有以下路由：

$ rootScope.userRole ==“ CATUSER”

if ($rootScope.userRole == "CATUSER") {

    $routeProvider
        .when("/catheter", {
            title: "Catheter Expiration Code Generator",
            templateUrl: "app/catheter/catheter.html",
            controller: "CatheterController",
            controllerAs: "vm"
        })
        .when("/support", {
            title: "Support",
            templateUrl: "app/support/support.html",
            controller: "SupportController",
            controllerAs: "vm"
        })
        .otherwise({
            redirectTo: "/catheter"
        });

}

$ rootScope.userRole ==“ LICUSER”

if ($rootScope.userRole == "LICUSER") {

    $routeProvider
        .when("/license", {
            title: "License Generator",
            templateUrl: "app/license/license.html",
            controller: "LicenseController",
            controllerAs: "vm"
        })
        .when("/support", {
            title: "Support",
            templateUrl: "app/support/support.html",
            controller: "SupportController",
            controllerAs: "vm"
        })
        .otherwise({
            redirectTo: "/license"
        });

}

$ rootScope.userRole ==“ ALLUSER”

if ($rootScope.userRole == "LICUSER") {

   $routeProvider
        .when("/license", {
            title: "License Generator",
            templateUrl: "app/license/license.html",
            controller: "LicenseController",
            controllerAs: "vm"
        })
        .when("/catheter", {
            title: "Catheter Expiration Code Generator",
            templateUrl: "app/catheter/catheter.html",
            controller: "CatheterController",
            controllerAs: "vm"
        })
        .when("/support", {
            title: "Support",
            templateUrl: "app/support/support.html",
            controller: "SupportController",
            controllerAs: "vm"
        })
        .otherwise({
            redirectTo: "/license"
        });

}

我不想使用UI路由器。

Answer 1

我过去将UI Router用于这种目的。这是示例代码，可以帮助您入门

angular
.module('app', [

])
.config(function ($stateProvider, $urlRouterProvider, $locationProvider) {
    $stateProvider
    .state('license', {
        url: 'url',
        templateUrl: './preview.html',
        controller: 'LicenseController',
        data: {
            requiredAuth: true,
            role: ['CATUSER', 'LICUSER'],
            permission : ['read', 'write', 'etc etc']
        }
    })
    $urlRouterProvider.otherwise(subdomain1 + 'error');
})
.run(['$rootScope', '$state', function ($rootScope, $state) {
    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {
        // is authenticated
        var isAuthenticationRequired = toState.data
              && toState.data.requiredAuth
              && !AuthService.isAuthenticated() //some service to check if user is authenticated (I use localstorage lookup here)
        ;
        // is authorized
        var isAuthorizationRequired = toState.data
              && (toState.data.role && AuthService.IsInRole(toState.data.role))
              && (toState.data.permission && AuthService.IsInPermission(toState.data.permission))
        ;
        if (isAuthenticationRequired) {
            event.preventDefault();
            $state.go('auth.login');
        }
        else if (isAuthorizationRequired) {
            event.preventDefault();
            $state.go('auth.denied');
        }
    });
    $rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams, error) {
        cfpLoadingBar.complete();
    });
    $rootScope.$on('$stateChangeError', function (event, toState, toParams, fromState, fromParams, error) {
        cfpLoadingBar.complete();
    });
}]);

在这里您看到许可路线具有属性数据。它要求进行身份验证，并且已获得LICUSER和CATUSER角色的授权。您还可以在此处添加更多权限检查，例如读取，写入等。如果用户经过身份验证和授权，则请求的请求状态将加载，否则将重定向到登录或拒绝的请求。

根据角色构建$ routeProvider

1 个答案: