0

项目组开发了一个vue的应用,在配置测试们做安全检查时发现了一个很大的漏洞:

在我们的许多vue组件上都有一个isAdmin属性,用来判断该用户是否为管理员,这个属性是通过接口取得的,但是通过在chrome的F12开发人员工具里修改这个isAdmin属性,竟然可以将非管理员直接改为管理员!
图片描述
后来我们尝试用vuex来写,把isAdmin写在Vue.$store.state里,发现还是可以人为更改

请教各位,有没有方法在vue里做安全的权限管理?

CathyZYF 155
2019-08-14 提问
4 个回答
3

已采纳

只要你依赖的是前端的缓存的变量来判断能不能进入页面,那一定可以伪造进入页面。
权限这个东西必须得后端请求。
对于Vue组件/Vuex等相关地方的数据,通过document都可以全部获取并进行更改。

如果想控制权限,应该使用路由守卫,在路由进入之前,向后端请求权限信息,看当前用户是否有权进入页面,无权限则重定向到首页,有权限则进入页面。

并且最重要的是后端的接口必须做权限判断!后端必须有不相信客户端的意识才能最大程度确保安全。

1

前端很难彻底解决这个问题。毕竟你的代码人家也能看见。
稳妥的解决办法是交给后端,每次去后端读/写数据的时候,应该对用户的权限做检查。

1

前端的权限需要你在登录系统的时候,首先从后端获取当前登陆人的权限有哪些,然后根据后台返回的数据过滤前端路由,就是说根据后台返回的数据将你的路由重新生成一个新的路由,然后写一个公共的方法,判断是否存在,然后再router.beforeEach中判断当前输入的路由是否存在与我新生成的路由中,如果不存在直接返回一个中404页面

0

前端只能做到按钮级或者路由控制,你这个必须要后台每次校验

撰写答案

推广链接