总览:

总的思路来讲实现权限控制分为页面的权限以及页面按钮的权限,页面权限可以简单理解为哪些页面这个用户可以看见,哪些页面用户不能看见,按钮权限同理,哪些按钮用户可以看见,哪些按钮用户看不见,为什么不直接做成禁用按钮呢?试想一下,页面里面的按钮都让你看见了,你偏偏点不了,还给它禁用了,干脆直接眼不见心不烦,不同的用户对应的权限点不一样,所以可以看见的页面也就不一样,看到页面一样了,但是有的用户页面有这个按钮,有的用户则没有,这就是权限控制的思路所在.

详解之页面权限:

先说下页面权限的实现思路,每一个用户的账号不一样,他们所对应的角色也不一样,通过给不同的用户账号去添加不同的角色,给不同的角色添加不同的页面权限点,来实现页面权限

再具体一点来讲,在路由拦截器里面去获取用户的信息,在后台返回的数据里面有标识符,而这些标识符就是控制页面权限的关键所在,将其与设置好的动态路由来进行对比,过滤出符合用户账号角色的路由,通过router.addRoutes方法将其添加到路由里面,然后再去vuex中开辟一个文件来做侧边栏展示的动态路由,然后在侧边栏的组件里去进行渲染,这样页面权限的控制则完成了

图为在路由拦截器里面去获取用户权限点来过滤动态路由并将其添加到仓库中

图为在vuex中去存储动态路由

图为在侧边栏组价去渲染对应的动态路由

页面权限控制还需要注意的两个bug,其一是因为动态路由是动态添加的,在静态路由的后面,按照代码的执行顺序,所以需要将404页面也去进行动态添加,以免出现刚进入就会直接匹配到404页面

第二个bug是在路由导航守卫的next()方法中,需要将要去的路径直接写成to.path,以免出现跳转不到对应的页面,出现白屏的bug

详解之页面按钮权限:

在页面权限设置好的基础上,在每个页面对应的权限点下面再去设置按钮权限,实现的思路是通过自定义指令,与拿取到的用户信息中的按钮权限关键字去进行比对,如果比对通过,就说明用户有看见这个按钮的权限,就不用去做任何处理,如果比对没有通过,就说明用户没有这个按钮的权限,就可以通过父元素移除子元素的dom操作来移除这个按钮

图为自定义指令的代码

 图为在组件的按钮中去使用这个指令

--------------------------------------------------浅聊完毕!OVER --------------------------------------------------------

浅聊下后台管理系统权限控制的实现思路相关推荐

  1. 众筹项目之后台管理系统-权限控制(九)

    目录 1. 项目中加入 SpringSecurity 1.1 加入 SpringSecurity 环境 2.1.1 依赖 1.1.2 在 web.xml 中配置 DelegatingFilterPro ...

  2. day09【后台】权限控制-下

    day09[后台]权限控制-下 1.目标5:密码加密 1.1.修改数据库表结构 由于之前使用MD5加密,密码字段长度为32位:现采用带盐值的加密,需要修改密码字段的长度 顺带把密码也改了 1.2.注入 ...

  3. P22-Vue3后台管理系统-权限管理之路由守卫判断⽤户登录状态

    P22-Vue3后台管理系统-权限管理之路由守卫判断⽤户登录状态 文章目录 P22-Vue3后台管理系统-权限管理之路由守卫判断⽤户登录状态 1.概述 2.mock接口返回token 2.1.mock ...

  4. 基于Vue实现后台系统权限控制

    原文地址:http://refined-x.com/2017/08/29/基于Vue实现后台系统权限控制/,转载请注明出处. 用Vue这类双向绑定框架做后台系统再适合不过,后台系统相比普通前端项目除了 ...

  5. day08【后台】权限控制-上

    day08[后台]权限控制-上 1.密码加密 1.1.PasswordEncoder接口 PasswordEncoder接口的代码如下: 将明文密码加密为密文密码 判断明文密码是否与密文密码一致 pu ...

  6. VUE后台管理系统权限管理

    VUE后台管理系统权限管理(面试路由守卫) 1.背景 后台管理系统中总会遇到权限分配的问题:这也是一道vue的很经典的面试问题 2.解决思路 权限管理无非前端或者后台解决 先说一下前端解决的思路:在设 ...

  7. 后台管理系统权限管理详解

    权限管理 简述权限管理: 你可以在后台通过一个 tree 控件或者其它展现形式给每一个页面动态配置权限,之后将这份路由表存储到后端.当用户登录后得到roles,前端根据roles去向后端请求可访问的路 ...

  8. SSM框架实现后台管理系统权限管理(用户、菜单、角色)

    文章目录 后台管理系统开发 一.数据库表结构设计 1.菜单表menu 2.用户表user 3.角色表role 4.角色权限表role_menu 5.用户角色表user_role 二.项目准备 1.创建 ...

  9. 06_04_SSM拉勾教育后台管理系统(权限模块\登录及动态菜单)

    拉勾教育后台管理系统(SSM)权限模块 权限概念介绍 权限:权利(能做的)和限制(不能做的),在权限范围内做好自己的事情,不该看的不看,不该做的不做 认证: 验证用户名密码是否正确的过程 授权: 对用 ...

最新文章

  1. 为了自动驾驶,谷歌用NeRF在虚拟世界中重建了旧金山市
  2. apache起步命令加-k参数和不加的区别
  3. 每日简单小妙招:使用python实现控制摄像头拍照并将其发送某某邮箱(仅供学习)
  4. Axure RP Pro 6.0 原型设计工具(产品经理必备)
  5. SAP GraphQL on Kyma
  6. 架构师论坛 创业_我在早期创业时作为设计师学到的东西
  7. 城市智慧停车系统方案的产品设计体系介绍
  8. 从外包公司到今日头条offer,含BATJM大厂
  9. java 连接IBM MQ的方法和常见问题
  10. 如何和周围的人搞好关系?
  11. margin-top的兼容问题
  12. NOIP201103瑞士轮【B002】
  13. c语言链表插入尾部,为什么我的程序一执行插入链表尾部,再执行别的操作就会出现问题,...
  14. 加工机械双探头高频读写器CK-FR102AN用户开发手册
  15. MATLAB中的信号处理
  16. WMI的讲解(是什么,做什么,为什么)
  17. 银河麒麟安装docker-compose体验
  18. 【Kepware与S71500连接 返回协议错误0X81解决方案】
  19. 粒子群算法总结+背包问题
  20. 英语 —语法— 句子成分

热门文章

  1. C#InaNutShell中文第七版:TryCatch异常处理
  2. 给定一个非负整数 num,反复将各个位上的数字相加,直到结果为一位数。返回这个结果。
  3. 【C++】面试题目,整理自牛客网
  4. 如何在本地服务器绑定域名及host文件的使用说明
  5. Apple 在中国的维修和保修政策
  6. ap模式和sta模式共存_ESP8266 RTOS 开发笔记(1)STA+AP模式(共存)
  7. 出现Expected to return a value in arrow function.问题解决方法
  8. AAA认证——IE阶段
  9. Python学习之线性图
  10. NTC热敏电阻采集温度