局域网办公系统设计与实现：Spring Boot + Vue 内网部署实战

简介这份PDF文档面向通信工程、网络工程等专业的课程设计学习者以及需要搭建小型办公网络的企业技术人员围绕小型局域网与企业信息中心局域网的设计与实现展开。内容从需求分析入手梳理信息中心网络的特点与建设背景进而讲解网络技术选型、内部局域网结构设计、服务器配置与外网结构并给出拓扑图、IP分配方案及综合布线实施要求最后附有致谢与完整目录。资源包内仅含1个PDF文件大小约1.95MB属于典型的课程设计说明书结构完整、章节清晰便于按模块查阅。文档重点阐述了局域网设计思想、解决方案与管理方法读者可据此理解交换机星型拓扑的选型依据、网络号规划与设备配置思路并参考其需求分析与布线要求完成自己的组网方案。目前已有180人学习适合作为网络课程设计、毕业设计或企业小型办公网络规划的参考材料。1. 局域网办公系统到底在解决什么问题从一份 PDF 标题说起很多人看到「小型局域网以及企业局域网办公系统的设计与实现」这个标题第一反应是「又是一个毕设题目」。但如果你真的在一家 20 到 200 人的公司里待过就会知道这个题目背后压着的是一堆非常具体的麻烦文件共享靠 U 盘来回拷、请假审批靠微信群接龙、设备台账散在三个 Excel 里、新员工入职要手动开五六个账号。局域网办公系统要干的就是把这些散落的动作收进一个内网可访问的统一入口让数据不出内网、权限能落到人、流程能留痕。它适合两类人一类是中小企业里兼着 IT 的运维或行政想用最低成本把内部协作拉起来另一类是要做课程设计或毕业设计的同学需要一个能跑通、能演示、能讲清楚架构的完整项目。核心词「局域网」决定了部署边界「办公系统」决定了功能范围「设计与实现」决定了你得拿出可复现的架构和代码而不是一份 PPT。这一章先把边界划清楚后面几章再一层层落到选型、建库、写接口和排错上。2. 架构选型为什么局域网办公系统不该照搬公网 SaaS 那套局域网办公系统和公网 SaaS 最大的区别在于用户就在同一栋楼里网络延迟通常低于 5ms带宽是内网千兆甚至万兆而且你不需要考虑 CDN、跨地域容灾和公网安全防护。这意味着很多在公网场景下必须做的复杂设计在局域网里可以直接砍掉。但反过来局域网也有自己的约束服务器可能只是一台闲置的台式机没有公网 IP运维人员可能只有你一个出了问题没人兜底。2.1 B/S 还是 C/S先看客户端维护成本局域网办公系统最常见的两种形态是 B/S浏览器/服务器和 C/S客户端/服务器。B/S 的优势是零安装员工用浏览器打开一个内网 IP 就能用升级只需要更新服务器C/S 的优势是能调用本地资源比如直接读写本地文件、调用打印机、做局域网远程开机。实际项目中我一般会选 B/S 为主、C/S 为辅的混合方案核心办公功能走浏览器文件批量传输和设备管理这类重客户端操作单独做一个轻量客户端。选 B/S 时有一个容易被忽略的点跨浏览器支持。内网环境里经常混着 Chrome、Edge、360 浏览器甚至 IE 兼容模式前端如果用了太新的 API在老机器上直接白屏。稳妥的做法是锁定 ES2017 语法用 Babel 转译CSS 避免使用容器查询这类新特性。2.2 技术栈组合Spring Boot Vue 为什么成了默认答案如果你去搜「基于 springboot vue 办公系统的设计与实现」会发现大量项目都用了这套组合。这不是跟风而是因为它确实适合局域网场景Spring Boot 内嵌 Tomcat打成一个 jar 包就能跑不需要单独装 Web 服务器Vue 打包后是一堆静态文件扔进 Nginx 或者直接由 Spring Boot 的 static 目录托管都行。数据库用 MySQL 8.0缓存用 Redis可选文件存储直接用服务器本地磁盘。下面是一个最小可跑的 Spring Boot 项目结构我把它拆成了几个关键文件你可以直接照着建。# 项目目录结构 office-lan/ ├── pom.xml ├── src/main/java/com/company/office/ │ ├── OfficeApplication.java │ ├── config/ │ │ ├── WebConfig.java │ │ └── SecurityConfig.java │ ├── controller/ │ │ ├── AuthController.java │ │ └── FileController.java │ ├── service/ │ │ └── FileService.java │ └── mapper/ │ └── UserMapper.java ├── src/main/resources/ │ ├── application.yml │ └── static/ # Vue 打包后的文件放这里 └── sql/ └── init.sql这个结构里config放全局配置controller对外暴露接口service写业务逻辑mapper用 MyBatis 或 MyBatis-Plus 操作数据库。static目录是给 Vue 打包产物用的这样前后端可以打成一个 jar部署时只需要java -jar一条命令。2.3 数据库表设计从员工、部门到文件权限局域网办公系统的表不用多但几张核心表必须设计清楚。下面这张表列出了最小可用版本需要的表及其关键字段。表名用途关键字段注意事项sys_user员工账号id, username, password, dept_id, role密码必须 BCrypt 加密sys_dept部门id, name, parent_id支持树形结构sys_role角色id, name, permissions权限用 JSON 存office_file文件记录id, name, path, uploader, dept_idpath 存相对路径office_notice公告id, title, content, publish_time富文本要过滤 XSSoffice_approval审批单id, type, applicant, status, flow_json状态机要明确建表时有一个血泪经验office_file表的path字段不要存绝对路径。服务器迁移或者换盘符时绝对路径全部失效改成存相对于上传根目录的路径读取时再拼接。CREATE TABLE sys_user ( id BIGINT PRIMARY KEY AUTO_INCREMENT, username VARCHAR(50) NOT NULL UNIQUE, password VARCHAR(100) NOT NULL, real_name VARCHAR(50), dept_id BIGINT, role_id BIGINT DEFAULT 2, status TINYINT DEFAULT 1, create_time DATETIME DEFAULT CURRENT_TIMESTAMP ) ENGINEInnoDB DEFAULT CHARSETutf8mb4; CREATE TABLE office_file ( id BIGINT PRIMARY KEY AUTO_INCREMENT, file_name VARCHAR(255) NOT NULL, file_path VARCHAR(500) NOT NULL, file_size BIGINT, uploader_id BIGINT, dept_id BIGINT, upload_time DATETIME DEFAULT CURRENT_TIMESTAMP, INDEX idx_dept (dept_id), INDEX idx_uploader (uploader_id) ) ENGINEInnoDB DEFAULT CHARSETutf8mb4;sys_user里role_id默认给 2 表示普通员工1 留给管理员。office_file建了两个索引因为按部门查文件和按上传人查文件是最频繁的两个操作。字符集统一用utf8mb4否则员工名字里有生僻字或者 emoji 会直接报错。3. 把系统跑起来从建库到内网访问的完整步骤架构定下来之后下一步就是让它真的能在局域网里跑起来。这一章按顺序走一遍准备环境、初始化数据库、配置后端、打包前端、启动服务、最后让同事能通过内网 IP 访问。3.1 服务器环境准备一台普通 PC 就够了局域网办公系统对服务器要求很低。我实测过一台 4 核 8G 内存的旧台式机装 Ubuntu Server 22.04跑 MySQL Spring Boot Nginx支撑 80 人同时在线没有压力。如果公司有 Windows Server也可以直接用但要注意 Windows 下文件路径分隔符和权限模型跟 Linux 不一样。# Ubuntu 下安装基础环境 sudo apt update sudo apt install -y openjdk-17-jdk mysql-server nginx # 确认 Java 版本 java -version # 输出应为 openjdk version 17.0.x # 启动 MySQL 并设置开机自启 sudo systemctl enable mysql sudo systemctl start mysql # 创建数据库和专用用户 sudo mysql -u root -p进入 MySQL 后执行CREATE DATABASE office_lan DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; CREATE USER officelocalhost IDENTIFIED BY YourStrongPassword123; GRANT ALL PRIVILEGES ON office_lan.* TO officelocalhost; FLUSH PRIVILEGES;这里创建了一个专用用户office而不是直接用 root 连数据库。原因是如果应用配置泄露攻击者拿到的只是一个只能操作office_lan库的账号不会危及整个 MySQL 实例。密码不要用123456内网也不是绝对安全的。3.2 后端配置application.yml 里那几个必须改的参数Spring Boot 的配置文件决定了应用能不能连上数据库、文件传到哪、日志写在哪。下面是一份可以直接用的application.yml。server: port: 8080 servlet: context-path: /office spring: datasource: url: jdbc:mysql://localhost:3306/office_lan?useUnicodetruecharacterEncodingutf8serverTimezoneAsia/Shanghai username: office password: YourStrongPassword123 driver-class-name: com.mysql.cj.jdbc.Driver servlet: multipart: max-file-size: 500MB max-request-size: 500MB jackson: date-format: yyyy-MM-dd HH:mm:ss time-zone: GMT8 office: upload: root-path: /data/office/upload/ allowed-extensions: doc,docx,xls,xlsx,pdf,jpg,png,zip logging: file: name: /data/office/logs/office.log level: com.company.office: debug几个关键参数说明max-file-size设成 500MB 是因为局域网内传设计图或视频素材很常见默认的 1MB 根本不够用。root-path指向一个独立的数据盘目录不要放在应用目录下否则重新部署时容易误删。allowed-extensions做白名单校验防止有人上传.exe或.sh到服务器。3.3 前端打包与内网访问Nginx 反向代理配置Vue 项目打包后是一堆静态文件用 Nginx 托管最稳。下面这份配置同时处理了前端路由和 API 转发。server { listen 80; server_name 192.168.1.100; root /data/office/web; index index.html; location / { try_files $uri $uri/ /index.html; } location /office/ { proxy_pass http://127.0.0.1:8080/office/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; client_max_body_size 500m; } }try_files那行是给 Vue Router 的 history 模式用的不加的话刷新页面会 404。client_max_body_size必须跟后端的上传限制对齐否则大文件会在 Nginx 层就被拦掉报 413 错误。配置改完后sudo nginx -t测试语法然后sudo systemctl reload nginx。同事访问时直接在浏览器输入http://192.168.1.100就能打开。如果打不开先在本机curl -I http://127.0.0.1确认 Nginx 正常再检查防火墙sudo ufw allow 80/tcp和sudo ufw allow 8080/tcp。3.4 文件共享与权限局域网文件夹访问权限怎么落到系统里局域网办公系统绕不开文件共享。有两种做法一种是直接用 Windows 共享文件夹或 Samba系统里只存文件索引另一种是文件全部通过系统上传下载服务器磁盘做实际存储。我推荐第二种因为权限能跟系统账号绑定不会出现「共享文件夹密码全公司都知道」的情况。实现上文件下载接口要做三层校验用户是否登录、用户所在部门是否有该文件权限、文件是否被标记为删除。下面是一个简化的校验逻辑。public Resource downloadFile(Long fileId, Long userId) { OfficeFile file fileMapper.selectById(fileId); if (file null || file.getDeleted() 1) { throw new BusinessException(文件不存在); } SysUser user userMapper.selectById(userId); if (!user.getDeptId().equals(file.getDeptId()) user.getRoleId() ! 1) { throw new BusinessException(无权访问该文件); } Path path Paths.get(uploadRoot, file.getFilePath()); return new FileSystemResource(path); }这段代码里管理员roleId1可以跨部门下载普通员工只能下载本部门文件。实际项目中还可以加一层「文件密级」字段把权限控制做得更细。4. 避坑与排查局域网办公系统上线后最容易翻车的 5 个点系统能跑起来只是第一步真正让人头疼的是上线后那些「昨天还好好的今天就不行了」的问题。这一章列 5 个我实际踩过的坑每个都按现象、原因、解决来写。4.1 现象部分同事打不开系统提示连接超时原因通常不是服务器挂了而是网络分段。很多公司局域网里办公区、会议室、机房在不同的 VLAN 或子网如果服务器只绑了一个网段跨网段访问就会被路由或防火墙挡住。解决办法先让打不开的同事ping 服务器IP如果 ping 不通就是网络层问题找网管确认 VLAN 间路由是否放行。如果 ping 通但浏览器打不开检查服务器防火墙是否只允许了特定网段。Linux 下用sudo ufw status或sudo iptables -L -n查看规则。4.2 现象上传大文件到 99% 失败这个坑非常经典。原因通常是 Nginx 的client_max_body_size和后端max-file-size不一致或者后端 Tomcat 的连接超时太短。文件传到 99% 时其实数据已经发完了卡在服务器写磁盘或响应阶段。解决办法三处配置必须对齐——Nginx 的client_max_body_size、Spring Boot 的max-file-size和max-request-size、以及数据库连接的超时时间。另外上传目录所在磁盘要留足空间df -h确认一下磁盘满了也会表现成上传失败。4.3 现象员工反馈「我的文件别人能看见」这是权限设计的问题。很多快速开发的项目为了省事文件列表接口直接SELECT * FROM office_file前端再根据部门过滤。这种「前端过滤」等于没有权限任何人改一下请求参数就能拿到全量数据。解决办法权限校验必须放在后端而且要在 SQL 层面就加上部门条件。上面 3.4 节的代码示例就是正确做法。另外文件下载链接不要用可猜测的自增 ID可以用 UUID 做文件名数据库里存映射关系。4.4 现象系统用了一段时间后越来越慢原因可能是日志文件把磁盘写满了或者数据库表没有建索引数据量上来后查询变慢。局域网办公系统的数据增长其实不快但如果office_file表到了几十万行还没有索引列表查询就会明显卡顿。解决办法定期清理日志用logrotate做日志轮转。数据库方面office_file的dept_id、uploader_id、upload_time都建议建索引。另外文件列表接口要做分页默认每页 20 条不要一次性返回全部。4.5 现象服务器重启后系统没自动起来原因是没有配置开机自启。局域网服务器可能因为断电或维护重启如果每次都要手动登录去启动服务运维成本太高。解决办法Spring Boot 应用注册成 systemd 服务MySQL 和 Nginx 本身支持systemctl enable。下面是一个 systemd 单元文件示例。[Unit] DescriptionOffice LAN System Aftermysql.service [Service] Useroffice ExecStart/usr/bin/java -jar /data/office/office-lan.jar Restartalways RestartSec10 [Install] WantedBymulti-user.target放到/etc/systemd/system/office.service然后sudo systemctl daemon-reload sudo systemctl enable office sudo systemctl start office。Restartalways保证进程崩溃后自动拉起RestartSec10避免频繁重启。5. 进阶技巧用局域网远程开机和离线部署把系统用得更顺手系统跑稳之后可以再往前做一步。局域网办公系统有一个天然优势你可以直接控制内网设备。比如结合 Wake-on-LAN 做远程开机员工早上到公司前服务器已经启动或者把整个系统做成离线部署包在没有外网的环境里也能一键安装。5.1 用 Wake-on-LAN 让服务器按需启动很多小公司不会让服务器 24 小时开着但又希望员工到公司时系统已经可用。Wake-on-LAN 的思路是发一个魔术包到目标网卡网卡收到后触发开机。Linux 下可以用etherwake或wakeonlan命令。# 安装 wakeonlan sudo apt install -y wakeonlan # 发送魔术包MAC 地址替换成服务器网卡的实际地址 wakeonlan -i 192.168.1.255 00:11:22:33:44:55-i指定广播地址一般是子网的广播地址。目标机器需要在 BIOS 里开启 Wake-on-LAN并且操作系统里网卡不能完全断电。这个技巧适合服务器放在机房、员工在办公区的情况。如果服务器本身就是一台常开的 NAS那就不需要了。5.2 离线部署包把依赖全部打包带走有些企业内网完全隔离不能访问外网apt install和pip install都用不了。这时候需要提前在有网环境里把依赖下载好做成离线包。Java 项目相对简单因为 fat jar 里已经包含了所有依赖只需要目标机器有 JDK。MySQL 和 Nginx 可以用 deb 包离线安装。# 在有网机器上下载 deb 包及其依赖 apt-get download mysql-server nginx openjdk-17-jdk # 把当前目录下所有 deb 包拷到 U 盘 # 在离线机器上安装 sudo dpkg -i *.deb sudo apt-get install -f # 修复依赖如果本地有依赖包的话更稳妥的做法是用 Docker 打包整个环境导出成 tar 文件目标机器docker load后直接docker-compose up。但 Docker 本身也需要离线安装所以如果目标机器连 Docker 都没有还是 deb 包最直接。5.3 一个验证系统是否真正可用的检查清单上线前我会跑一遍下面这个清单确认没有遗漏。检查项验证方法通过标准数据库连接重启 MySQL 后应用能否自动重连无需手动重启应用文件上传上传一个 200MB 的 zip成功且能下载权限隔离用普通账号访问其他部门文件返回 403跨网段访问从不同 VLAN 的机器访问页面正常加载开机自启重启服务器系统自动恢复日志轮转查看 /var/log 下日志大小不超过 500MB这个清单不复杂但每次部署新环境我都会过一遍。有一次就是漏了跨网段测试结果会议室的人用不了被投诉了一周。做局域网办公系统这件事我的习惯是先把最小闭环跑通——登录、传文件、看公告——再往上加审批和权限。不要一上来就设计十几张表最后发现核心流程还没通。希望帮到你。本文还有配套的精品资源点击获取