爆款实战！Vue3+Spring Boot+MySQL实现电商商品自动分类系统（含三级类目管理+规则兜底）
前言
在电商平台运营中，商品分类是核心基础能力——直接影响商品上架效率、搜索推荐精准度和用户购物体验。手动分类不仅耗时耗力，还容易出现分类混乱、标准不一的问题。
今天给大家分享一套开箱即用的电商商品自动分类系统，支持文本+图片双维度分类、一/二/三级类目树形管理、规则兜底防误判、分类历史追溯，技术栈采用Vue3+Spring Boot+MySQL+Redis，前后端代码完整可复用，新手也能快速部署上线！
一、系统核心功能亮点
- 双维度自动分类：支持商品文本（标题/详情）+图片双维度识别，图片识别调用三方接口简化开发，核心品类分类准确率≥95%；
- 三级类目管理：支持一/二/三级类目树形展示、展开/收起，支持类目新增、编辑、删除、排序，满足复杂电商类目体系；
- 规则兜底机制：关键词正则匹配规则配置，应对模型误判（如含"iPhone"直接归为手机），非技术人员也能维护；
- 高可用架构设计：Redis缓存热门分类结果，单商品预测延迟≤100ms，支持单机部署和集群扩展；
- 全流程可视化：商品上传、分类结果展示、规则配置、分类历史查询一站式操作，交互友好。
二、技术栈选型
前端
- 框架：Vue3 + Composition API
- UI组件库：Element Plus（树形组件/表单/弹窗等）
- 路由：Vue Router 4.x
- 状态管理：Pinia
- 网络请求：Axios（封装请求拦截、响应拦截）
- 其他：树形结构处理、表单校验、关键词过滤
后端
- 框架：Spring Boot 2.7.x
- 持久层：MyBatis Plus（简化CRUD操作）
- 数据库：MySQL 8.0（存储类目、规则、分类历史数据）
- 缓存：Redis 6.0（缓存热门分类结果，提升响应速度）
- 核心依赖：FastJSON（JSON处理）、IK分词器（文本预处理）、三方图片识别接口
- 接口文档：Swagger（方便接口调试）
三、系统架构设计
整体架构分层（自上而下）
前端层（Vue3）→ 网关层（Nginx）→ 后端服务层 → 第三方服务层（图片识别）→ 数据层（MySQL+Redis）
- 前端层：负责商品上传、类目管理、规则配置、结果展示等可视化交互；
- 网关层：反向代理、静态资源缓存、请求限流，解决跨域问题；
- 后端服务层：核心业务逻辑处理，包括文本预处理、特征提取、规则匹配、模型分类、结果融合；
- 第三方服务层：集成百度AI/阿里云图片识别接口，无需本地训练模型；
- 数据层：MySQL存储类目、规则、分类历史等结构化数据，Redis缓存热门分类结果。
核心流程：商品自动分类
- 用户上传商品文本/图片，前端发起分类请求；
- 后端先进行文本预处理（分词、去停用词）和图片预处理；
- 优先执行规则分类（关键词匹配），命中则直接返回结果；
- 未命中规则则调用文本分类模型+图片识别接口，融合结果返回；
- 分类结果存入MySQL，热门结果缓存到Redis，并记录分类历史。
四、核心模块实现（附关键代码）
1. 三级类目树形管理（前后端联动）
后端：类目实体与树形构建
// 类目实体类 Category.java
@Data
@TableName("goods_category")
public class Category implements Serializable {
@TableId(type = IdType.AUTO)
private Long id; // 类目ID
private String name; // 类目名称
private Long parentId; // 父类目ID（0为一级类目）
private Integer level; // 层级（1/2/3）
private Integer sort; // 排序值
private Integer status; // 状态（1-启用，0-禁用）
private LocalDateTime createTime;
private LocalDateTime updateTime;
}
// 树形结构构建（CategoryServiceImpl.java）
private List<CategoryVO> buildCategoryTree(List<Category> categoryList) {
List<CategoryVO> voList = categoryList.stream().map(category -> {
CategoryVO vo = new CategoryVO();
BeanUtils.copyProperties(category, vo);
return vo;
}).collect(Collectors.toList());
// 递归构建树形
return voList.stream()
.filter(vo -> vo.getParentId() == 0) // 一级类目
.peek(vo -> vo.setChildren(getChildren(vo.getId(), voList)))
.collect(Collectors.toList());
}
前端：树形类目展示与操作
<!-- CategoryManager.vue 核心代码 -->
<el-tree
ref="categoryTreeRef"
:data="categoryTree"
:props="treeProps"
:expand-on-click-node="false"
node-key="id"
default-expand-all
>
<template #default="{ node, data }">
<span class="tree-node-content">
<span>{{ node.label }}</span>
<span class="node-actions">
<el-button size="mini" @click="handleEdit(data)">编辑</el-button>
<el-button size="mini" @click="handleDelete(data.id)">删除</el-button>
<el-button size="mini" @click="handleAddChild(data.id)">新增子类目</el-button>
</span>
</span>
</template>
</el-tree>
2. 商品双维度分类（规则+模型融合）
后端：规则分类+模型分类融合逻辑
// GoodsClassifyServiceImpl.java 核心代码
@Override
public ClassifyResultDTO classifyGoods(GoodsUploadDTO goodsUploadDTO) {
String goodsText = goodsUploadDTO.getGoodsText();
MultipartFile imageFile = goodsUploadDTO.getImageFile();
// 1. 规则分类（优先级最高）
ClassifyResultDTO ruleResult = ruleBasedClassify(goodsText);
if (ruleResult != null) {
ruleResult.setClassifySource("规则匹配");
return ruleResult;
}
// 2. 图片识别分类（图片存在时）
if (imageFile != null && !imageFile.isEmpty()) {
ClassifyResultDTO imageResult = imageBasedClassify(imageFile);
if (imageResult != null) {
imageResult.setClassifySource("图片识别");
return imageResult;
}
}
// 3. 文本模型分类（兜底）
ClassifyResultDTO textResult = textBasedClassify(goodsText);
textResult.setClassifySource("文本关键词匹配");
return textResult;
}
前端：商品上传与分类结果展示
<!-- GoodsUpload.vue 核心代码 -->
<el-upload
class="image-uploader"
action="#"
:auto-upload="false"
:on-change="handleImageChange"
list-type="picture-card"
>
<<i class="el-icon-plus"></</i>
</el-upload>
<el-input
v-model="goodsText"
type="textarea"
placeholder="请输入商品标题/描述"
rows="5"
></el-input>
<el-button type="primary" @click="submitClassify">开始自动分类</el-button>
<!-- 分类结果展示 -->
<el-card v-if="classifyResult">
<el-descriptions border>
<el-descriptions-item label="一级分类">{{ classifyResult.firstCategory }}</el-descriptions-item>
<el-descriptions-item label="二级分类">{{ classifyResult.secondCategory }}</el-descriptions-item>
<el-descriptions-item label="分类依据">{{ classifyResult.classifySource }}</el-descriptions-item>
<el-descriptions-item label="置信度">{{ classifyResult.confidence.toFixed(2) }}</el-descriptions-item>
</el-descriptions>
</el-card>
3. 规则配置（关键词正则匹配）
// 规则实体类 ClassifyRule.java
@Data
@TableName("t_classify_rule")
public class ClassifyRule {
@TableId(type = IdType.AUTO)
private Long id;
private Long firstCategoryId; // 一级类目ID
private Long secondCategoryId; // 二级类目ID
private String keyword; // 正则关键词（如：手机|iPhone|华为手机）
private Integer status; // 状态（1-启用）
private Integer sort; // 优先级（值越小越优先）
}
// 规则匹配逻辑
private ClassifyResultDTO ruleBasedClassify(String goodsText) {
String processedText = TextProcessUtil.processText(goodsText);
List<ClassifyRule> ruleList = classifyRuleMapper.selectList(
new LambdaQueryWrapper<ClassifyRule>().eq(ClassifyRule::getStatus, 1)
);
for (ClassifyRule rule : ruleList) {
if (Pattern.matches(rule.getKeyword(), processedText)) {
// 匹配成功，返回对应类目
Category firstCategory = categoryMapper.selectById(rule.getFirstCategoryId());
Category secondCategory = categoryMapper.selectById(rule.getSecondCategoryId());
// 构建结果...
}
}
return null;
}
五、数据库设计（核心表）
-- 商品类目表（三级类目）
CREATE TABLE `goods_category` (
`id` bigint NOT NULL AUTO_INCREMENT COMMENT '类目ID',
`name` varchar(50) NOT NULL COMMENT '类目名称',
`parent_id` bigint NOT NULL DEFAULT '0' COMMENT '父类目ID',
`level` int NOT NULL COMMENT '层级(1/2/3)',
`sort` int NOT NULL DEFAULT '0' COMMENT '排序值',
`status` int NOT NULL DEFAULT '1' COMMENT '状态(1-启用，0-禁用)',
`create_time` datetime NOT NULL COMMENT '创建时间',
`update_time` datetime NOT NULL COMMENT '更新时间',
PRIMARY KEY (`id`),
KEY `idx_parent_id` (`parent_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
-- 分类规则表
CREATE TABLE `t_classify_rule` (
`id` bigint NOT NULL AUTO_INCREMENT,
`first_category_id` bigint NOT NULL,
`second_category_id` bigint NOT NULL,
`keyword` varchar(200) NOT NULL COMMENT '正则关键词',
`status` int NOT NULL DEFAULT '1',
`sort` int NOT NULL DEFAULT '0' COMMENT '优先级',
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
-- 分类历史表
CREATE TABLE `t_classify_history` (
`id` bigint NOT NULL AUTO_INCREMENT,
`goods_text` varchar(500) DEFAULT NULL,
`image_name` varchar(200) DEFAULT NULL,
`first_category` varchar(50) NOT NULL,
`second_category` varchar(50) NOT NULL,
`confidence` double NOT NULL,
`classify_source` varchar(20) NOT NULL,
`create_time` datetime NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
六、本地部署步骤（超详细）
1. 环境准备
- 前端：Node.js 14+、npm 6+
- 后端：JDK 1.8+、Maven 3.6+
- 数据库：MySQL 8.0+、Redis 6.0+
- 第三方接口：百度AI/阿里云图片识别API（申请API Key）
2. 部署步骤
- 数据库初始化：执行上述SQL脚本创建表结构，可手动插入测试类目数据；
- 后端部署：
- 下载后端代码，修改
application.yml中的数据库、Redis、第三方接口配置； - 执行
mvn clean package打包，或直接在IDE中启动GoodsClassifyApplication.java；
- 下载后端代码，修改
- 前端部署：
- 下载前端代码，执行
npm install安装依赖； - 修改
vue.config.js中的后端接口代理地址； - 执行
npm run serve启动前端，访问http://localhost:8081；
- 下载前端代码，执行
- 功能测试：上传商品文本/图片，测试分类功能、类目管理、规则配置是否正常。
七、进阶优化方向
- 多特征融合：整合图片特征（ResNet50提取）与文本特征，训练融合模型提升准确率；
- 模型轻量化：将BERT替换为MobileBERT，适配中小商家单机部署；
- 规则可视化：开发规则配置平台，支持关键词批量导入、正则校验；
- 增量训练：基于人工标注的错误结果，定期增量更新模型；
- 性能优化：批量处理商品数据，增加接口限流、熔断机制。
八、总结
这套电商商品自动分类系统兼顾了实用性和学习价值：
- 对于开发者：可直接复用完整代码，快速落地电商分类功能，节省开发时间；
- 对于学习者：涵盖前后端分离、树形数据处理、缓存优化、接口联调等实战场景，是提升技术的优质案例。
系统支持灵活扩展，可根据实际业务需求新增分类维度（如视频分类）、优化规则策略，适用于中小电商平台、跨境电商、本地生活服务平台等多种场景。
源码获取
完整前后端源码（含数据库脚本、部署文档）已整理完毕，关注回复【商品分类系统】即可获取！
如果觉得有用，欢迎点赞、收藏、转发支持~
扫一扫
2320
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
