Vue内的权限管理业务(文字讲解)

RBAC的权限设计思想

首先,我们先了解下什么是传统的权限设计

Vue内的权限管理业务(文字讲解)_第1张图片

从上面的图中,我们发现,传统的权限设计是对每个人进行单独的权限设置,但这种方式已经不适合目前企业的高效管控权限的发展需求,因为每个人都要单独去设置权限

基于此,RBAC的权限模型就应运而生了,RBAC(Role-Based Access control) ,也就是基于角色的权限分配解决方案,相对于传统方案,RBAC提供了中间层Role(角色),其权限模式如下

简单理解就是,将用户、角色、权限之间建立一种关系,当为用户赋权时,可用通过角色来间接赋权。

基于此,RBAC的权限模型就应运而生了,RBAC(Role-Based Access control) ,也就是基于角色的权限分配解决方案,相对于传统方案,RBAC提供了中间层Role(角色)

Vue内的权限管理业务(文字讲解)_第2张图片

权限管理业务上需要完成的几件事件

1. 用户管理:给用户设置角色

2. 角色管理:给角色赋值权限点

3. 用户登录有权限数据,这些权限数据要与路由对应上

以下是我个人一些总结

权限我是用的RBAC权限设计思想,之前比较旧的权限设计,是对每个人进行单独的权限设置,但这种方式已经不适合企业里去高效管理权限的需求,因为每个人都要单独去设置权限。而RBAC就很好解决了这个问题,基于角色权限分配解决方案,相对于传统的那种方案,RBAC提供了中间层Role (也就是角色)。

我们来举个例子

首先,用户管理,需要给给用户设置角色,角色管理: 给角色赋值权限点,用户登录有权限数据,这些权限数据要与路由对应上。

在系统管理模块的用户管理界面,管理人员可以根据条件查询操作,还可以对系统用户进行添加、删除、修改、重置密码以及设置角色等操作

之后需要将将路由配制分成二块,静态路由动态路由

静态路由的页面是无需权限就能访问的,默认路由配制中只有静态路由;

动态路由则是需要权限管理的路由,在动态路由中加入与路由权限数据的匹配点,在获取用户信息后将用户信息中路由权限数据和动态路由数据做匹配;匹配过程就是对动态路由数据做筛选,选择中当前项的meta.name的值在路由权限数据中是否存在 (将动态路由过演后添加到路由配制),最后在更新到菜单栏中

以下是我遇到的坑点(问题)

  • 坑点

- 菜单不显示了

- 原因:addRoutes的路由没有更新到this.$router.options.routes

- 解决方案:手动更新

  • 404问题

- 原因:addRoutes添加的路由不能立马使用,

- 解决:

- 将404通过addRoutes添加

  • 刷新进入不了

- 原因addRoutes添加的路由需要再走一次导航守卫才可用

- 解决: next(to)

欢迎指正

你可能感兴趣的:(vue.js,javascript,前端)