前端权限控制要做什么?

·  阅读 1709
前端权限控制要做什么?

本文没有代码,单纯谈谈实现思路,接下来会(考虑)实现一个最小可行方案

让我们想想,要做一个系统的前端权限控制要做什么。

前端权限做什么

在这之前,我一直认为前端来做权限控制,就像是我把钥匙放在家门口脚垫下。没有x用。因为在我理解,对于权限的控制,应该是从接口层面来进行控制,但是想想从整个工程角度来看,前端还是可以做很多事的哦,例如最常见的:

  1. 路由控制URL访问
  2. 菜单控制用户入口
  3. 权限点控制特定功能

先说说路由控制,对于路由层面来说,我们可以做很多事, 比如我们可以做一个可以解析带权限路由的配置表。通过在路由配置上不同的角色,达到路由级别的权限控制。例如: 如果你是管理员,那么你可以看到所有页面,如果你是访客, 你自然看不到管理页面。继而重定向到权限申请或者提示无权限页面。而不是白屏。在什么地方都可以做这件事,但是在路由级别进行则是再好不过来。

再看看菜单, 很简单, 如果用户不是it从业人员,那么对于他来说,一个网页产品的入口无非就是url和全局菜单来进行访问。URL会在路由级别得到控制。而对菜单控制也就控制了入口。

最后是粒度最小的权限点控制。对于权限点可以理解为前端权限最小粒度控制。角色本质上是一组权限的集合。我们做的所有的权限控制,其实是基于权限点。而权限点的使用无非就是if-else语句。举个例子:搜索功能。我们对搜索功能在后台配了权限,在前端应用初始化的时候,我们会拿到用户的角色信息,用户所拥有的权限点。那么我们在渲染的时候,会根据我们得到的权限点,去判定这个搜索按钮,有, 还是没有。这就是前端权限控制了。

当然, 我相信大家也会了解接口权限控制。这个也说一下。接口权限控制目前用得比较多的方法是,jwt, 也就是用户登陆成功后,返回一个token, 之后用户所有的操作我们都要带上这个token, 用于接口信息验证。如果没有token,那么不让用户调这个接口。具体的实现大家可以去看jwt的知识。

设计权限点

在上面有提到,我们的角色其实本质上是一组权限点的集合成为一个权限。为了方便表达我们会使用权限矩阵。其实也就是角色与权限点的对应关系。其实这个部分要更多的和这个产品的设计者去谈,去敲定这个权限矩阵,跟最熟业务的那个人去谈,去定义每个角色的行为。角色存在的原因会决定这个角色会有什么权限点。在设计的时候可以通过业务场景来模拟这个用户的行为, 就大概可以知道这个用户应该是什么权限。闭上眼睛,假设你是用户,你在这个产品要完成什么目的, 你的行为会确定你的权限点。

但是最最重要的是,去跟这个产品的负责人去谈, 他有话语权。也为了更好的完成任务, 需求尽可能的清晰。

任务

假设权限点清晰,系统角色清晰,后台接口暂时不用考虑。我们现在可以做什么?

  1. 对于路由控制, 我们无非是把路由变成可配置,然后写个路由解析, 根据路由上的角色信息, 对不同的路由作出不同的反应(无权限啊之类的),再做个动态路由加载(那我是用户, 我又没有必要加载管理员的路由啊)
  2. 对于菜单,其实可以把路由跟菜单结合起来。因为路由的权限其实就是菜单的权限。而用户访问肯定不会只通过url去访问,而是通过菜单,所以路由其实就是菜单。当然对于菜单而言,还有个定位问题,我们可以根据路由去达成资源定位, 这一点也很重要。例如你访问/user/bloglist 那么刷新页面对于你的菜单状态应该为: 用户(一级菜单)->bloglist(二级菜单)
  3. 对于权限点, 其实对于权限点我们需要的是一个高阶组件, 高阶组件包裹目标组件(例如:搜索按钮)。这个高阶组件以权限点或判定权限函数, 决定组件的显示和隐藏或者其他行为。

还有啥补充可以留言。

ps:

把一篇文章分成四五篇来写就轻松了很多。下班回家。

分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改