关于vue路由权限控制

hmy666
  • 100

一般像这种前后端分离的框架,前端控制路由菜单,思路是什么样子的?

1.前端路由表配置用户组:【'admin','user'】,然后登录根据后台返回的role的角色,分配相应的菜单路由;
2.前端登录,发送用户信息,后台直接返回配置好的菜单信息,根据菜单信息动态生成菜单路由;

然后有一个问题,上面的关于路由权限的相关信息,为了持久化存储,直接存储在本地,那么如果用户直接修改本地存储所存放的路由权限信息,那么岂不是可以获取原本不属于他的权限了吗,那么该如何解决这种问题呢?

回复
阅读 1.1k
3 个回答
不死小强
  • 1.7k
✓ 已被采纳

你可以看一下RBAC的一些实现,前端控制一些菜单、路由以及按钮的权限不应该按用户的角色来,而是按照权限来,角色是权限的一个集合,而且角色是可以编辑和增删的。
比如说用户管理功能我可以初始化对应user-opr,user-view这个两个权限,分别对应用户操作和查看功能(具体按需求细分),当用户有view这个权限就表明他可以看到用户管理的菜单,用户管理的页面可以看到并操作查看按钮,这跟他是哪个角色无关,只要这个用户的某一个角色包含user-view这个权限就可以了。所以对于你的问题:
1.菜单不应该根据角色分配;
2.可以后台返回,也可以前端维护完整的菜单tree,根据用户的权限来筛选当前用户的菜单tree;
3.放到localStrorage里面也可以,也可以放到vuex或者redux中管理,权限后端也是要校验的,只有前端校验没有意义,毕竟可以绕过前端直接通过接口请求后端数据。

后端接口应该会有验证吧?实在担心安全性就不能存在本地

前端配置好所有路由,后端返回用户拥有的菜单,在路由拦截中根据菜单控制用户能否访问

宣传栏