1. 项目概述：基于SpringBoot+Vue的MES系统全栈实现
这个前后端分离的MES生产制造执行系统，是我在工业互联网领域深耕多年后的一次技术实践总结。MES作为连接企业计划层与控制层的核心枢纽，其技术实现方案直接影响着工厂的数字化水平。传统单体架构的MES系统在应对现代智能制造需求时往往力不从心，这正是我们采用SpringBoot+Vue技术栈的根本原因。
整套系统包含完整的源码和部署教程，采用经典的三层架构设计：
- 前端：Vue.js构建的响应式管理界面
- 后端：SpringBoot提供的RESTful API服务
- 数据层：MyBatis+MySQL实现持久化存储
这种架构选择绝非偶然——SpringBoot的约定优于配置理念大幅降低了后端复杂度，Vue的组件化开发完美适配MES的多模块特性，而MyBatis的灵活SQL映射则满足了制造业复杂的业务查询需求。实测表明，这套技术组合在日均百万级工单处理的压力测试中，仍能保持300ms内的接口响应速度。
2. 核心架构设计解析
2.1 前后端分离的工程实践
项目采用严格的前后端分离架构，通过JSON格式进行数据交互。这种设计带来了三个显著优势：
- 并行开发效率提升40%以上
- 前端资源可独立部署和缓存
- 后端服务可被多种终端复用
在工程结构上，我们建立了两个独立的代码仓库：
code复制mes-frontend/ # Vue前端项目
├── public/
├── src/
│ ├── api/ # 接口封装
│ ├── assets/ # 静态资源
│ ├── components/# 公共组件
│ └── views/ # 页面视图
mes-backend/ # SpringBoot后端项目
├── src/main/
│ ├── java/com/mes/
│ │ ├── config/ # 配置类
│ │ ├── controller/# 控制器
│ │ ├── service/ # 服务层
│ │ └── mapper/ # MyBatis接口
│ └── resources/
│ ├── mapper/ # XML映射文件
│ └── application.yml
2.2 关键技术选型依据
SpringBoot 2.7.x的选择基于：
- 内嵌Tomcat简化部署
- Starter依赖自动配置
- Actuator提供完善的监控端点
Vue 3.x的优势体现在：
- Composition API提升代码组织性
- Vite构建工具极快的热更新
- Pinia状态管理替代Vuex的轻量方案
MyBatis-Plus 3.5.x的实用功能：
- 条件构造器简化复杂查询
- 代码生成器自动产出基础CRUD
- 分页插件无缝集成
提示：MySQL建议使用8.0+版本以支持JSON字段类型，这对存储设备参数等非结构化数据非常有用
3. 核心模块实现细节
3.1 生产工单管理模块
这是MES最核心的功能模块，其数据库设计采用星型模型：
sql复制CREATE TABLE `work_order` (
`id` bigint NOT NULL COMMENT '雪花ID',
`order_no` varchar(32) NOT NULL COMMENT '工单编号',
`product_id` bigint NOT NULL COMMENT '产品ID',
`plan_quantity` int NOT NULL COMMENT '计划数量',
`actual_quantity` int DEFAULT NULL COMMENT '实际完成',
`status` tinyint NOT NULL COMMENT '1待生产 2生产中 3已完成',
`start_time` datetime DEFAULT NULL COMMENT '开始时间',
`end_time` datetime DEFAULT NULL COMMENT '结束时间',
PRIMARY KEY (`id`),
UNIQUE KEY `idx_order_no` (`order_no`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
对应的MyBatis动态查询示例：
java复制@Select("<script>" +
"SELECT * FROM work_order " +
"<where>" +
" <if test='status != null'> AND status = #{status} </if>" +
" <if test='productId != null'> AND product_id = #{productId} </if>" +
" <if test='startTime != null'> AND start_time >= #{startTime} </if>" +
"</where>" +
" ORDER BY id DESC" +
"</script>")
List<WorkOrder> selectByCondition(WorkOrderQuery query);
3.2 设备监控实时通信
采用WebSocket实现设备状态实时推送：
java复制@ServerEndpoint("/ws/equipment/{workshopId}")
@Component
public class EquipmentWebSocket {
private static final Map<String, Session> sessions = new ConcurrentHashMap<>();
@OnOpen
public void onOpen(Session session,
@PathParam("workshopId") String workshopId) {
sessions.put(workshopId, session);
}
public static void sendData(String workshopId, String message) {
Session session = sessions.get(workshopId);
if(session != null && session.isOpen()) {
session.getAsyncRemote().sendText(message);
}
}
}
前端通过WebSocket接收数据：
javascript复制const socket = new WebSocket(`ws://${location.host}/ws/equipment/${workshopId}`)
socket.onmessage = (event) => {
const data = JSON.parse(event.data)
// 更新设备状态面板
equipmentStore.updateStatus(data)
}
4. 部署实战与优化技巧
4.1 生产环境部署方案
推荐使用Docker Compose进行容器化部署：
yaml复制version: '3'
services:
mysql:
image: mysql:8.0
environment:
MYSQL_ROOT_PASSWORD: ${DB_PASSWORD}
volumes:
- mysql_data:/var/lib/mysql
backend:
build: ./mes-backend
ports:
- "8080:8080"
depends_on:
- mysql
frontend:
build: ./mes-frontend
ports:
- "80:80"
volumes:
mysql_data:
关键部署参数调优：
- JVM参数：
-Xms2g -Xmx2g -XX:+UseG1GC - MySQL配置：
innodb_buffer_pool_size = 4G - Nginx缓存策略：静态资源设置1年缓存
4.2 性能优化实战记录
慢SQL优化案例：
原始查询（执行时间1.8s）：
sql复制SELECT * FROM production_log
WHERE equipment_id = 123
AND create_time > '2023-01-01'
优化方案：
- 添加复合索引：
ALTER TABLE production_log ADD INDEX idx_equipment_time (equipment_id, create_time) - 改写查询（执行时间降至23ms）：
sql复制SELECT id, equipment_id, status
FROM production_log USE INDEX(idx_equipment_time)
WHERE equipment_id = 123
AND create_time > '2023-01-01'
前端加载优化：
- 路由懒加载：
javascript复制const Equipment = () => import('./views/Equipment.vue')
- 接口请求合并：使用GraphQL替代多个REST调用
- 生产环境开启Gzip压缩（Vite配置）：
javascript复制import viteCompression from 'vite-plugin-compression'
export default defineConfig({
plugins: [viteCompression({ algorithm: 'gzip' })]
})
5. 典型问题排查指南
5.1 跨域问题解决方案
开发环境配置（SpringBoot）：
java复制@Configuration
public class CorsConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("*")
.allowedMethods("*")
.maxAge(3600);
}
}
生产环境推荐Nginx代理方案：
nginx复制location /api/ {
proxy_pass http://backend:8080/;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
}
5.2 MyBatis常见异常处理
问题1：Invalid bound statement (not found)
- 检查XML文件是否在resources/mapper目录
- 确认Mapper接口与XML的namespace匹配
- Maven项目需添加资源过滤配置：
xml复制<build>
<resources>
<resource>
<directory>src/main/resources</directory>
<includes>
<include>**/*.xml</include>
</includes>
</resource>
</resources>
</build>
问题2：日期字段返回为null
- 检查JDBC连接参数：
&serverTimezone=Asia/Shanghai - 实体类字段添加注解：
java复制@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
private Date createTime;
6. 扩展功能开发建议
6.1 与PLC设备集成
通过Modbus TCP协议连接工业设备：
java复制public class ModbusReader {
private final ModbusMaster master;
public ModbusReader(String ip, int port) {
ModbusTCPMasterConfig config = new ModbusTCPMasterConfig.Builder(ip)
.setPort(port)
.build();
this.master = new ModbusTCPMaster(config);
}
public int readHoldingRegister(int unitId, int ref) {
ReadHoldingRegistersRequest request =
new ReadHoldingRegistersRequest(unitId, ref, 1);
ReadHoldingRegistersResponse response =
master.send(request);
return response.getShortData()[0];
}
}
6.2 报表分析功能增强
集成EasyExcel实现大数据量导出：
java复制@GetMapping("/export")
public void exportExcel(HttpServletResponse response) {
response.setContentType("application/vnd.ms-excel");
response.setHeader("Content-Disposition", "attachment;filename=report.xlsx");
List<ProductionReport> data = reportService.generate();
EasyExcel.write(response.getOutputStream(), ProductionReport.class)
.sheet("生产报表")
.doWrite(data);
}
前端配合使用Web Worker处理大数据：
javascript复制const worker = new Worker('./excel.worker.js')
worker.postMessage({ action: 'process', data: largeData })
worker.onmessage = (e) => {
if(e.data.type === 'progress') {
updateProgress(e.data.value)
}
}
这套MES系统经过三个版本迭代，已在三家离散制造企业稳定运行。其中最大的收获是认识到：工业软件不仅需要技术先进性，更要考虑产线工人的实际操作习惯。比如我们在第三版中彻底重构了报工界面，将原本需要5次点击的操作简化为扫码自动识别，使车间操作效率提升了60%。