vue-router前端权限控制问题
前提纲要:
1.用户A和用户B有不同的权限。
页面分左侧菜单部分和右侧内容部分,右侧内容可能有不同路径的不同内容
最简单例子为点击左侧用户管理
右侧显示用户列表
点击某条内容详情
右侧显示某一用户的详细内容
2.用户A可以访问路径权限如下:
a/list a/detail/:id a/list/:id
用户B可以访问路径权限如下:
b/list b/detail/:id b/list/:id
3.正常用户登陆进去可以看到自己的菜单,
点击菜单右侧内容部分发生变化,然后在右侧操作,更改页面url,左侧菜单不变,右侧内容页发生变化
碰到问题如下:
用户B登陆进去点击菜单进入b/detail/:id然后保存为书签(即保存该路径)退出
然后用户A登陆点击保存的标签页,正常获取左侧菜单权限,左侧菜单正常显示,但是右侧却根据url显示了自己权限外的b/detail/:id的内容(暂不考虑跟服务端交互问题,虽说服务端可以再掉用接口时给出无权限返回,前端再根据返回进行逻辑处理,但即便这样前端页面显示依旧不正常)
解决方案:
在路由进入之前,根据路由的meta属性的某一字段比对所有的可访问权限(这个在登录时已经获取了,可以存在localstorage里),如果能找到则进去否则跳转到某个固定页,这样就解决了权限问题
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/93272.html
摘要:我们将登录按钮上绑上事件,点击登录之后向服务端提交账号和密码进行验证。所以前端和后端权限的划分是不太一致。侧边栏最后一个涉及到权限的地方就是侧边栏,不过在前 完整项目地址:vue-element-admin 系列文章: 手摸手,带你用vue撸后台 系列一(基础篇) 手摸手,带你用vue撸后台 系列二(登录权限篇) 手摸手,带你用vue撸后台 系列三 (实战篇) 手摸手,带你用vu...
摘要:有一天突然想到一个问题,端的权限控制真的能控制权限吗仅仅靠前端,能不能做到真正的权限控制如果需要后台配合,应该如何配合可能这是一个老生常谈的问题,但还是想整理下,有误的地方望大家指出。 有一天突然想到一个问题,web端的权限控制:1.真的能控制权限吗?2.仅仅靠前端,能不能做到真正的权限控制?3.如果需要后台配合,应该如何配合?可能这是一个老生常谈的问题,但还是想整理下,有误的地方望大...
阅读 3155·2021-11-22 15:25
阅读 3795·2021-11-17 09:33
阅读 3334·2021-11-08 13:15
阅读 3026·2021-09-22 10:56
阅读 517·2021-08-31 09:45
阅读 2727·2019-08-30 13:49
阅读 3057·2019-08-30 12:52
阅读 1124·2019-08-29 17:05