Spring boot+vue模拟RBAC权限管理

Spring boot+vue模拟RBAC权限管理

    • 文章知识介绍
    • 数据库表格展示
    • 演示效果
    • 项目说明
    • 示例下载
    • 参考文章

文章知识介绍

RBAC(Role-based access control)模型,基于角色的访问权限控制,将权限赋予角色,同时针对角色进行用户权限的分配,是一种较容易实现和理解的权限管理模型

它包含0、1、2、3一共四种模型,最简单和容易理解的即是本文章要介绍的0级模型,由五张表组成基本的结构:用户表、角色表、菜单表、用户角色表、角色菜单表(权限表)

实际上要形成较为细粒度和合理的权限管理,需要设计的内容还有很多,本文只采用简单的拦截器来模拟权限管理的效果

数据库表格展示

用户表(为了简单设计,我将用户角色表给省去了,在用户表加了一个role_id字段;不过在实际使用中还是需要用户角色表来控制多种角色的)
Spring boot+vue模拟RBAC权限管理_第1张图片
Spring boot+vue模拟RBAC权限管理_第2张图片

角色表(只是简单模拟效果,所以对于角色没有添加别的信息,类似角色描述,创建时间等)
Spring boot+vue模拟RBAC权限管理_第3张图片
Spring boot+vue模拟RBAC权限管理_第4张图片

菜单表(为了和前端vue形成呼应,在这里使用菜单路径,在前端可以生成对应的菜单)
Spring boot+vue模拟RBAC权限管理_第5张图片
Spring boot+vue模拟RBAC权限管理_第6张图片

角色菜单表(权限表)(简单模拟一个角色包含的菜单)
Spring boot+vue模拟RBAC权限管理_第7张图片
Spring boot+vue模拟RBAC权限管理_第8张图片

演示效果

登陆界面,用户登录后后端自动获取到对于的角色,然后加载对应菜单,展示在前端页面中
Spring boot+vue模拟RBAC权限管理_第9张图片

菜单管理(采用element-plus组件展示和管理菜单,比较常见的后台管理表格页面)
Spring boot+vue模拟RBAC权限管理_第10张图片

角色管理(采用树形组件加载角色对应的菜单,还是蛮贴切的;不过目前为了设计简单,我只设计了一级菜单的形式;实际上设计二级菜单才比较合适,不过设计二级菜单在代码逻辑和前端展示上会复杂一些,有想法的同学可以在文章结尾发表自己的想法,欢迎交流)
Spring boot+vue模拟RBAC权限管理_第11张图片

拦截器代码(实现权限管理;目前只是简单采用请求路径前缀的方式进行统一处理,权限的处理细节目前还不是很到位,但是也算差强人意了;如果有更好的想法,欢迎在文章末尾发表)
Spring boot+vue模拟RBAC权限管理_第12张图片

项目说明

项目只是笔者为了学习RBAC模型和element-plus的Tree组件而简单编写的示例代码;后面想到了在线开发丰富项目的一种思路,而想设计一个在线的文件编辑器,然后可以较为简单的设计一个后台管理系统;当然,这个设计也是为了学习在线文件编辑相关的知识,毕竟其中涉及到的文件内对电脑资源的访问控制,也是一个难点。同时如果能够设计一款类似在线的VSCode一样的带文件夹的编辑器,还是有许多工作要做的。

示例下载

RBAC模型模拟

参考文章

你知道权限管理的RBAC模型吗?

你可能感兴趣的:(vue,项目,spring,boot,vue.js,后端)