实现基于角色的访问控制这几天忙于应用的前端工作,主要使用angular来做。最近的一个要求是基于角色的GUI访问。一个用户可以有多个角色,他应该只能访问他被授权访问的GUI部分。我们主要通过两个层面限制应用程序的GUI访问来解决上述需求:一个用户只能访问授权给他的页面(或流量)。在一个页面上,用户只能看到授权给他的部分。解决上面的需求1,我们捕获路由变化事件,检查每一次路由变化,看用户是否有权限访问下一个路由,保证他不会看到拒绝访问的页面$rootScope.$on("$routeChangeStart",function(event,next,current){if(!authService.isUrlAccessibleForUser(next.originalPath))$location.path('/authError');});上面的authService是我们创建的一个服务,它有角色用户列表和路由流量到授权用户。函数isUrlAccessibleForUser()将检查分配的用户是否可以访问给定的流量并返回true或false。服务会从后台和路由访问信息中获取一个用户的角色列表,每个角色都会保存在服务自身的一个Map集合中。(一些用户和角色的详细信息可以存储在数据中心,通过后台获取)app.factory('authService',function($http){varuserRole=[];//从后台获取'/dashboard','/about-us','/authError'],'ROLE_USER':['/usersettings','/usersettings/personal','/authError']};return{userHasRole:function(role){for(varj=0;j
