Mean stack web app的基于角色的访问控制 _控制

少年恃险若平地，独倚长剑凌清秋。这篇文章主要讲述Mean stack web app的基于角色的访问控制相关的知识，希望能为你提供帮助。
我正在研究一个平均堆栈Web应用程序，它包含基于已记录用户角色的差异访问。管理员，政府，志愿者等几个角色很少。
1.如何根据角色管理前端？
目前我正在为每个角色设置全局标志，如isAdmin，isVolunteer，isGovt等，并根据它们的值，我能够使用data-ng-if = "Global.isAdmin"显示不同的UI
这种方法是否正确。如果没有请建议处理UI的正确方法。
2.如果用户没有授权，如何管理后端并重定向路由？
【Mean stack web app的基于角色的访问控制】目前我正在尝试使用angular-permission和rbac，但仍然无法在我的应用程序中成功使用它们。任何人都可以告诉我基于角色的访问控制的平均堆栈Web应用程序的最佳实践。
在尝试使用angular-permission时，我无法将创建的角色链接到路由文件。
这是角色模块。

angular.module('mean.users', ['permission']) .run(['permission', 'Global', '$q', function(Permission, Global, $q) { console.log('not anonumous'); Permission .defineRole('anonymous', function(stateParams) { var deferred = $q.defer(); if (Global.user) { deferred.resolve(); } else { deferred.reject(); } return deferred.promise; }) .defineRole('admin', function(stateParams) { if (Global.isAdmin) { deferred.resolve(); } else { deferred.reject(); } return deferred.promise; }) .defineRole('govt', function(stateParams) { if (Global.isGovt) { deferred.resolve(); } else { deferred.reject(); } return deferred.promise; }) .defineRole('volunteer', function(stateParams) { if (Global.isVolunteer) { deferred.resolve(); } else { deferred.reject(); } return deferred.promise; }); } ]);

如何在路由文件中链接以上配置的角色

$stateProvider .state('create user', { url: '/users/create', templateUrl: 'users/views/create.html', resolve: { loggedin: checkLoggedin } }) .state('all users', { url: '/users/list', templateUrl: 'users/views/list.html', data: { permissions: { only: ['admin'], redirectTo: 'home' } } }) .state('show user', { url: '/users/:userId/view', templateUrl: 'users/views/view.html', resolve: { loggedin: checkLoggedin } }) .state('edit user', { url: '/users/:userId/edit', templateUrl: 'users/views/edit.html', data: { permissions: { only: ['admin'] } } }) .state('myprofile', { url: '/users/:userId/me', templateUrl: 'users/views/myprofile.html', resolve: { loggedin: checkLoggedin }});

答案从你的代码示例中我猜你正在使用mean.io.
这是我在前端基于角色的访问控制的方法，在mean.io中。
首先，我将角色添加到某些用户，以便它们存在于数据库中，我可以使用它们。

$ mean user a@example.com --addRole production $ mean user b@example.com --addRole sales

然后，我有2条路线添加到菜单中。在我的自定义模块的app.js中，我按角色过滤此路由，以便链接不会显示给其他角色：

Report.menus.add({ roles: ['production'], title: 'Production reports', link: 'production reports' }); Report.menus.add({ roles: ['sales'], title: 'Sales reports', link: 'sales reports' });

当然，这还不足以限制前端的访问。您可以轻松指向http://localhost:3000/#!/report/sales，您会看到销售报告是否具有销售角色。
诀窍在我的自定义模块的public / routes / report.js文件中，我按角色过滤视图。

'use strict'; angular.module('mean.report').config(['$stateProvider', function($stateProvider) { // Check if user has role var checkUserRole = function(role, $q, $timeout, $http, $location) { // Initialize a new promise var deferred = $q.defer(); // Make an AJAX call to check if the user is logged in and get user data including roles $http.get('/loggedin').success(function(user) { // Authenticated if (user !== '0' & & (user.roles.indexOf(role) > -1 || user.roles.indexOf('admin') > -1)) $timeout(deferred.resolve); // Not Authenticated else { $timeout(deferred.reject); $location.url('/auth/login'); } }); return deferred.promise; }; $stateProvider.state('report', { url: '/report', templateUrl: 'report/views/index.html' }) .state('production reports', { url: '/report/production', templateUrl: 'report/views/production.html', resolve: { loggedin: function($q, $timeout, $http, $location) { return checkUserRole('production', $q, $timeout, $http, $location) } } }) .state('sales reports', { url: '/report/sales', templateUrl: 'report/views/sales.html', resolve: { loggedin: function($q, $timeout, $http, $location) { return checkUserRole('sales', $q, $timeout, $http, $location) } } }); } ]);

如果用户未经身份验证，则会将其重定向到登录页面。如果他的角色错误，他会被重定向到主页。
这种方法基于文章模块。希望能帮助到你。