内网系统权限设计

需求背景

鉴于公司内网系统繁多，员工需要针对不同系统进行不同职责划分，由此产生内网系统权限统一设计需求。

设计思路

建立角色概念，为各个系统创建对应角色，配置不同权限。通过在不同系统内为同一账号配置不同角色，实现系统内权限控制。其中，各个功能点权限由业务方确认，研发进行创建，存入权限池（同一系统内权限功能点汇总的地方）。通过建立权限树（由权限池内各个权限功能点配置产生的数据结构），实现权限整体分层级剥离。通过角色创建，分配权限树中角色所需功能点，完成角色权限配置。最终，为帐号分配对应角色，完成权限控制。由于各个系统权限控制方式统一，以下设计方案均针对单个系统，区分多个系统权限仅需服务端增加字段表明系统来源即可。整体权限控制，服务端负责校验当前用户是否拥有当前请求的接口权限，前端负责控制菜单入口及功能点是否展示。

权限池

权限池用于存放当前系统内所有权限项。其中每一项都会成为权限树的组成部分。

权限池列表

如图所示，权限池所需元素有：权限ID，权限名称，及对应功能的接口地址。
基础功能：列表查询，添加权限项，修改权限项，删除权限项
对应字段解释：
权限ID：权限唯一标识。通过用户登录拿到用户当前所有权限ID列表，路由切换或页面刷新时校验当前页面中，每个权限ID是否存在于当前用户所拥有的权限ID列表中，以此判定用户是否拥有该功能权限。
权限名称：配置权限树时的展示项及权限描述
接口地址：该权限对应的后端接口地址，用于后端接口权限校验

权限树

权限树为单个系统所有权限集合，由业务方确认权限项后，研发从权限池中挑选对应权限项配置层级。之所以有层级概念，一方面考虑到了菜单渲染，另一方面方便配置人员配置对应页面下的权限项。

权限树

如图所示，权限树基础功能：添加权限项，修改权限项，删除权限项
通过修改权限树数据结构，可以为菜单渲染，权限配置渲染添加差异参数
树形结构使用的是element UI的组件，具体参照树形组件
数据结构如下：

[
  {
    "isShowOnMenu":true, //自定义参数，用来判断此权限项是否为菜单项
    "privilegeId":1006,
    "name":"账号管理",
    "menuUrl":"/account", //自定义参数，用来渲染菜单路由
    "children":[
      {
        "isShowOnMenu":true,
        "privilegeId":1017,
        "name":"账号列表",
        "menuUrl":"/account/list",
        "children":[
          {
            "isShowOnMenu":false,
            "privilegeId":1018,
            "name":"添加账号"
          }
        ]
      }
    ]
  }
]

权限树将会用来作为菜单渲染，角色分配的数据模版，因此，此处的创建顺序尤为重要。

角色配置权限

创建不同角色，通过共用同一份权限树，分配不同权限，为不同职能进行划分。其中，页面级权限分配在左侧，方便配置人员进行页面控制；功能级权限放在右侧，提供全选功能，方便配置人员进行权限功能细分。

角色配置权限

账号分配权限

为账号分配预先配置好权限的对应角色，完成账号在系统内的权限控制。

账号分配权限

写在最后

本文旨在提供权限设计整体逻辑，更多细节及代码实战敬请期待下一篇文章，权限开发实战。