登录
首页 >  文章 >  java教程

Java菜单系统配置化设计实战教程

时间:2026-01-13 15:18:57 290浏览 收藏

亲爱的编程学习爱好者,如果你点开了这篇文章,说明你对《Java配置化菜单系统设计实战详解》很感兴趣。本篇文章就来给大家详细解析一下,主要介绍一下,希望所有认真读完的童鞋们,都有实质性的提高。

菜单应配置驱动、动态渲染,后端仅提供按角色查询的标准接口,返回含id、parentId、path等字段的树形数据;权限校验需前后端双重控制,路由须动态注册,确保配置、权限、路由三者语义严格对齐。

在Java中如何实现配置化菜单系统_Java设计思路实战说明

菜单数据必须与业务逻辑解耦,用配置驱动渲染

菜单不是硬编码在 Controller 或前端模板里的静态结构,而是由配置中心(如 Nacos、Apollo)或本地 application.yml / JSON 文件定义的树形数据。核心在于:后端只提供 MenuService.getMenusByRole(String role) 这类接口,返回标准 List,字段包含 idparentIdpathcomponentpermission 等——这些字段直接映射到前端路由/权限系统,不掺杂 Java 业务判断。

常见错误是把菜单生成逻辑写进 @Controller 方法里,比如用 if-else 拼 HTML 或手动 new Menu 对象。这会导致每次加菜单都要改代码、发版、重启服务。

  • 菜单配置建议用 YAML 分层表达父子关系,避免手写 JSON 容易出错
  • path 字段必须符合前端 Vue Router / React Router 的路径规则(如 /user/list),不能带后缀或参数占位符
  • component 值应为前端组件路径字符串(如 "views/user/UserList.vue"),后端不做解析,只透传
  • 权限字段 permission 推荐用字符串数组(如 ["user:read", "user:export"]),方便前端 v-permission 指令消费

菜单实体需支持运行时动态组装,避免递归查询 N+1

数据库表设计通常为单表 sys_menu,含 idparent_idnamesortis_hidden 等字段。查菜单时不能对每个节点都查一次子节点(即 for 循环里调 menuMapper.selectByParentId(id)),否则 5 层深的菜单会触发几十次 SQL。

正确做法是一次性查出全部有效菜单(按角色过滤 + 状态校验),再用 Java 内存组装树:

public List<MenuDTO> buildMenuTree(List<MenuDO> allMenus) {
    Map<Long, MenuDTO> menuMap = allMenus.stream()
        .filter(m -> !m.getIsHidden())
        .collect(Collectors.toMap(MenuDO::getId, this::convertToDTO));
    
    List<MenuDTO> rootList = new ArrayList<>();
    for (MenuDTO node : menuMap.values()) {
        Long parentId = node.getParentId();
        if (parentId == null || parentId == 0 || !menuMap.containsKey(parentId)) {
            rootList.add(node);
        } else {
            menuMap.get(parentId).getChildren().add(node);
        }
    }
    return rootList;
}
  • 务必在 SQL 层就用 WHERE role_code IN (...) 或关联 sys_role_menu 表完成权限过滤,不要查全量再 Java 过滤
  • sort 字段用于同级排序,组装树后需对每个 children 列表调用 Collections.sort(...),按 sort 升序
  • DTO 中的 children 字段类型必须是 List,不能是 List 或泛型擦除后无法序列化的类型

    权限校验不能只靠菜单配置,必须叠加接口级注解控制

    菜单配置里的 permission 字段只决定“是否显示该菜单项”,不等于“用户能访问对应接口”。如果仅靠菜单配置做鉴权,攻击者绕过前端直接请求 /api/user/delete?id=1 就能越权。

    必须在 Controller 方法上加权限注解,例如:

    @DeleteMapping("/delete")
    @PreAuthorize("hasPermission('user:delete')")
    public Result delete(@RequestParam Long id) { ... }
    • @PreAuthorize 需配合 Spring Security 自定义 PermissionEvaluator 实现,从当前登录用户中提取权限集合,比对字符串
    • 菜单配置中的 permission 和接口注解中的字符串必须完全一致(大小写、冒号、下划线敏感)
    • 前端点击菜单时,应校验当前用户是否拥有该菜单的 permission;但后端接口仍要二次校验,不可信任前端传来的任何标识
    • 避免把权限字符串拼成动态表达式(如 "hasPermission('" + menu.getPermission() + "')"),易被注入

    前端路由需由后端菜单数据自动生成,禁止手动维护 router/index.js

    Vue 项目中,router/index.js 不应写死 routes: [ { path: '/user', component: UserList } ]。而应通过后端接口获取菜单后,用 router.addRoute() 动态注册:

    // fetchMenus().then(menus => {
    //   menus.forEach(menu => {
    //     router.addRoute({
    //       path: menu.path,
    //       name: menu.name,
    //       component: () => import(`@/views${menu.component}`),
    //       meta: { permissions: menu.permission }
    //     })
    //   })
    // })

    这个过程的关键约束是:menu.component 必须是合法的相对路径,且前端工程中真实存在对应文件;否则 import() 会报 ChunkLoadError

    • 后端返回的 component 字段不能带文件后缀(如不要 "UserList.vue",而应是 "user/UserList"),由前端统一补 .vue
    • 路径别名(如 @/views)必须和前端 webpack/vite 配置一致,否则编译时报找不到模块
    • 动态路由不会出现在 router.getRoutes() 初始列表中,需要在守卫中检查是否已注册,未注册则先拉菜单再 addRoute,否则白屏
    菜单系统的复杂点不在树形组装,而在于配置、权限、路由三者的语义对齐——一个 permission 字符串要在数据库字段、Java 注解、前端指令、打包路径四个地方同时生效且保持一致。任何一处命名偏差或空格遗漏,都会导致菜单不显示或接口 403。

    今天关于《Java菜单系统配置化设计实战教程》的内容介绍就到此结束,如果有什么疑问或者建议,可以在golang学习网公众号下多多回复交流;文中若有不正之处,也希望回复留言以告知!

    最新阅读
    更多>
    课程推荐
    更多>
    • 前端进阶之JavaScript设计模式
      前端进阶之JavaScript设计模式
      设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
      立即学习 543次学习
    • GO语言核心编程课程
      GO语言核心编程课程
      本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
      立即学习 516次学习
    • 简单聊聊mysql8与网络通信
      简单聊聊mysql8与网络通信
      如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
      立即学习 500次学习
    • JavaScript正则表达式基础与实战
      JavaScript正则表达式基础与实战
      在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
      立即学习 487次学习
    • 从零制作响应式网站—Grid布局
      从零制作响应式网站—Grid布局
      本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
      立即学习 485次学习