一、意义
- 路由控制:用户登录后只能看到自己有权访问的导航菜单,也只能访问自己有权访问的路由地址,否则将跳转 4xx 提示页
- 视图控制:用户只能看到自己有权浏览的内容和有权操作的控件
- 请求控制:路由可能配置失误,按钮可能忘了加权限,这种时候请求控制可以用来兜底,越权请求将在前端被拦截
二、前端权限控制
- 接口权限:
通过axios请求拦截器进行拦截,每次请求的时候头部携带token。再通过相应拦截器处理 - 路由权限控制:
1)初始化即挂载全部路由,并且在路由上标记相应的权限信息,每次路由跳转前做校验
2)按需挂载
初始化的时候先挂载不需要权限控制的路由,比如登录页,404等错误页。如果用户通过URL进行强制访问,则会直接进入404,相当于从源头上做了控制
登录后,获取用户的权限信息,然后筛选有权限访问的路由,在全局路由守卫里进行调用addRoutes添加路由 - 菜单权限(页面与路由解耦):
1)菜单与路由分离,菜单由后端返回,前端定义路由
2)菜单和路由都由后端返回
通过addRoutes动态挂载 - 按钮权限
1)每个页面都要获取用户权限role和路由表里的meta.btnPermissions,然后再用v-if判断
2)(自定义指令