Mean stack web应用程序的基于angular色的访问控制
我正在处理一个平均堆栈web应用程序，其中包含基于logging的用户angular色的差异访问。 有很less不同的angular色，如pipe理员 ， 政府 ， 志愿者等。
1.如何根据angular色pipe理前端？
目前我正在为每个angular色设置全局标志，如isAdmin，isVolunteer，isGovt等，并根据他们的价值，我能够显示不同的用户界面使用data-ng-if = "Global.isAdmin"
这是无稽之谈吗？ 如果不是，请提出正确的方法来处理用户界面。
2.如果用户没有授权，如何pipe理后端并redirect路线？
目前我正在尝试使用angular度权限和rbac，但仍然无法在我的应用程序中成功地使用这些。 任何人都可以告诉我为基于angular色的访问控制平均堆栈web应用程序的最佳做法。
当试图使用angular度权限时 ，我无法将创build的angular色链接到路由文件。
这是angular色模块。
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; }); } ]);
如何在路由文件中链接上面的configurationangular色
$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.
这是我在前端使用基于angular色的访问控制的方法，在mean.io中。
首先，我将angular色添加到某些用户，以便他们存在于数据库中，我可以使用它们。
$ mean user a@example.com --addRole production $ mean user b@example.com --addRole sales
然后，我有2个路线添加到菜单。 在我的自定义模块的app.js中，我按照angular色过滤这个路由，以便链接不会显示给其他angular色：
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 ，您将看到销售报告是否具有销售angular色。
技巧来自我的自定义模块的public / routes / report.js文件，在那里我按angular色过滤视图。
'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) } } }); } ]);
如果用户未经身份validation，他将被redirect到login页面。 如果他的angular色错了，他会被redirect到主页。
这种方法是基于文章模块。 希望能帮助到你。