news 2026/4/23 14:34:34

Solon + EasyQuery + ElementPlus 实现后台管理系统之 08-权限认证优化

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
Solon + EasyQuery + ElementPlus 实现后台管理系统之 08-权限认证优化

精确到按钮级别的权限认证

基础原理

按钮级权限控制不是锦上添花,而是保障系统安全和用户体验的刚需,原因在于:

  • 数据安全与操作合规:不同角色的用户能执行的操作不同(比如普通员工只能查看数据,管理员能删除 / 编辑),如果仅做页面级权限,用户可能通过伪造请求(比如绕过前端手动调接口)执行越权操作,按钮级控制能从前端直接屏蔽非法操作入口,减少恶意请求。
  • 提升用户体验:避免给用户展示看得见但点不了的按钮,或点击后提示无权限的尴尬场景,让界面只显示用户真正能操作的功能,降低使用困惑。
  • 统一权限逻辑:前端和后端权限规则对齐,避免前端显示按钮但后端拒绝请求的不一致问题,减少前后端联调成本。

前端实现按钮级别的权限认证的核心逻辑:先获取用户权限标记集合 ->在渲染按钮时校验权限 -> 最终决定按钮是否显示/禁用。

前端优化

编写登录用户数据仓库(store/currentUser.js),存储当前登录用户权限标记列表:

import{ref,computed,reactive}from'vue'import{defineStore}from'pinia'exportconstuseCurrentUserStore=defineStore('currentUser',()=>{// 登录用户信息实体letcurrentUser=reactive({})// 当前用户菜单列表letcurrentMenu=reactive([])// 当前用户权限标记letcurrentPerms=reactive([])// 设置登录用户信息实体functionsetCurrentUser(currentUser){this.currentUser=currentUser}// 设置当前用户菜单列表functionsetCurrentMenu(currentMenu){this.currentMenu=currentMenu}// 设置当前用户权限标记functionsetCurrentPerms(currentPerms){this.currentPerms=currentPerms}functionhasPerms(identifier){// 判断当前用户是否拥有指定权限标记returnthis.currentPerms.includes(identifier)}return{currentUser,setCurrentUser,currentMenu,setCurrentMenu,currentPerms,setCurrentPerms,hasPerms}})

编写权限工具类(plugins/PermsUtil.js),优化将用户权限标记存储到仓库中方法:

// 将用户权限菜单存储到仓库中useCurrentUserStore().setCurrentMenu(toTreeList(response.data,false))// 将用户权限标记存储到仓库中(包含所有类型的权限)useCurrentUserStore().setCurrentPerms(response.data.map(perm=>perm.identifier))

编写页面组件,完善按钮级别的权限认证:

<el-buttontype="warning"@click="showAddDialog"v-if="useCurrentUserStore().hasPerms('system:users:add')">添加用户</el-button>

在浏览器中测试:

后端 API 的权限认证

基础原理

参考文档:https://sa-token.cc/doc.html#/use/jur-auth、https://sa-token.cc/doc.html#/use/at-check

后端 API 是系统数据和业务操作的唯一入口,前端权限认证仅为体验层防护,后端权限认证才是真正的安全兜底,原因在于:

  • 防越权操作:前端权限可被轻易绕过(比如通过 Apifox、抓包工具直接调用 API,或修改前端代码),如果后端不校验权限,恶意用户能执行删除数据、修改配置等高危操作,直接威胁系统安全。
  • 符合业务规则:不同角色的用户本就该有不同操作范围(如普通员工只能查数据,管理员能删数据),API 权限认证是业务规则在后端的落地,确保什么人能做什么事。
  • 降低系统风险:即使前端漏洞导致权限控制失效,后端的权限校验仍能拦截非法请求,避免单点漏洞引发全系统风险。

后端 API 实现权限认证的核心逻辑:登录生成身份凭证 Token -> 接口调用时校验凭证有效性并关联用户 -> 查询用户权限集合与 API 权限要求匹配 -> 匹配成功放行/失败拦截。

后端优化

编写权限认证是嫌累(cn.duozai.sadmin.config.StpInterfaceImpl),返回一个账号所拥有的权限码集合:

/** * SaToken权限认证实现类 */@ComponentpublicclassStpInterfaceImplimplementsStpInterface{/** * 返回一个账号所拥有的权限码集合 * @visduo * * @param loginId 登录id * @param loginType 登录类型 * @return 权限码集合 */@OverridepublicList<String>getPermissionList(ObjectloginId,StringloginType){// 从会话中获取权限列表(获取当前登录用户权限列表时存入)List<PermsEntity>permsList=(List<PermsEntity>)StpUtil.getSession().get("perms");// 遍历权限列表,获取权限标识列表List<String>identifierList=newArrayList<>();for(PermsEntitypermsEntity:permsList){identifierList.add(permsEntity.getIdentifier());}// 返回权限标识列表returnidentifierList;}/** * 返回一个账号所拥有的角色标识集合 (权限与角色可分开校验) * @visduo * * @param loginId 登录id * @param loginType 登录类型 * @return 角色标识集合 */@OverridepublicList<String>getRoleList(ObjectloginId,StringloginType){returnnewArrayList<>();}}

编写控制器,完善方法级别的权限认证:

@SaCheckPermission("system:users:add")// 注解校验@Post@Mapping("/add")publicResponseResultadd(){// ...}
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/23 11:04:04

网页前端如何配合Java实现1T文件分片上传的跨平台兼容?

广西IT软件公司大文件传输解决方案 作为广西IT行业软件公司项目负责人&#xff0c;针对产品部门提出的——100G级文件传输、断点续传稳定性、信创国产化适配、多技术栈兼容是核心痛点。结合公司现有JSP/SpringBoot技术栈与客户严格需求&#xff08;非打包下载、SM4/AES加密、I…

作者头像 李华
网站建设 2026/4/23 13:01:57

Docker+Nginx+Jenkins实现前端自动化部署 (超详细)

前期准备 基于Centos7系统云服务器一台。 基于Vue-cli的项目部署在gitlab之上。 部署目标 搭建DockerNginxJenkins环境&#xff0c;用于实现前端自动化部署的流程。具体的实现效果为开发人员在本地开发&#xff0c;push提交代码到指定分支&#xff0c;自动触发jenkins进行…

作者头像 李华
网站建设 2026/4/23 13:16:19

Azure 告警体系优化实践

背景 在云原生架构中,告警系统是保障服务稳定性的关键。然而,不合理的告警阈值会导致两个极端问题: 阈值过低:频繁告警,造成告警疲劳 阈值过高:无法及时发现问题 本文记录一次全面的 Azure 告警优化实践,涵盖 Container Apps、AI Foundry、API Management 等服务。 优…

作者头像 李华
网站建设 2026/4/18 4:53:02

论文AI率超过学校要求,怎么把论文AIGC疑似度降到20%?

2025年起&#xff0c;高校已明确要求毕业论文要检测AIGC率&#xff0c;AI率高于30%或40%就不能参加答辩&#xff0c;而部分学校、硕士论文更加严格&#xff0c;要求在20%以内。 这其中&#xff0c;大多数高校使用的AIGC检测系统是知网、万方、维普等主流查重系统&#xff0c;这…

作者头像 李华
网站建设 2026/4/23 1:07:57

降低知网AIGC疑似度的万能公式:比话降AI+手动调整。

2025年起&#xff0c;高校已明确要求毕业论文要检测AIGC率&#xff0c;AI率高于30%或40%就不能参加答辩&#xff0c;而部分学校、硕士论文更加严格&#xff0c;要求在20%以内。 这其中&#xff0c;大多数高校使用的AIGC检测系统是知网、万方、维普等主流查重系统&#xff0c;这…

作者头像 李华
网站建设 2026/4/23 12:32:04

ArcGIS大师之路500技---045最小外接矩形

文章目录前言一、需求说明二、操作步骤总结前言 本文介绍在 ArcMap 软件中&#xff0c;为面图层绘制最小外接矩形、最小外接圆等几何图形的方法。 一、需求说明 首先说明本文要实现的需求&#xff1a;现有一个面要素图层&#xff0c;其中包含多个面要素&#xff0c;如下图所示…

作者头像 李华