vue+php关于用户权限与权限更新

要想给前端页面的每个路由甚至是每个页面的一个按钮都添加相应权限,最好的办法就是将所有页面的路由存储在数据库中

上图中step代表了当前权限的层级,up_node代表此权限节点依托于上一个节点的id,一级权限的上级节点默认为-1,role_type代表权限种类,1代表根节点,2代表页面,3代表按钮。唯一标识marks为前端页面判定的唯一依据,与前端路由中meta.marks一致,如下图

由此转化为可视化页面为下图:

注意:层级关系最好和前端路由关系一致

 而权限和用户的关系在关系表中,

 这样就可以查到每个用户有哪些权限了。下面去到前端,用户登陆后获取该用户的权限列表,如下图,其结果存在vuex中,防止篡改,每次刷新页面后重新获取:

 在导航栏中将本地路由与获取的标识匹配,未匹配到的路由隐藏

 为防止在地址栏中输入路由跳转,须在路由守卫中进行验证,未匹配的直接拦截:

 效果如下:

 至于更新机制,我是怎么做的,关于权限的跟新判定一般采用1:在登陆后或者刷新页面后获取权限列表,但是无法使客户端实时获得最新权限。2:轮询,效率低,占用系统资源和流量过大;3:每次切换页面前请求权限列表,占用服务器资源和流量比二少点,但也高,而且用户不切页面就无法获取最新权限。4:websocket长链接,研究中。

所以本人采用了第五种:为每个用户一个权限版本字段直接写入用户表,每次修改权限给相应用户权限版本+1;初次登录时随token返给前端,前端每次请求时携带token,后台每次先验证token,再进入业务层,所有接口都判定,在当前版本小于数据库版本时,直接接口返回status码触发前端更新机制。

 将上图方法在公共入口处调用,通过后再进入各接口逻辑

而前端也要做相应处理,当status码返回403时,返回登录界面或是更新权限表

 以上就是本人关于vue+php实现权限系统的大致思路,要实现完整功能还需要完善一些细节,不过基本方向就是这样了

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值