最新YOLO实现的手写数字和符号识别检测平台（Flask+SocketIO+HTML_CSS_JS）

摘要

本文面向“手写数字与数学符号”的实时目标检测与识别场景，构建了基于 Flask + Flask-SocketIO + HTML/CSS/JS 的Web 网页界面与后端推理平台，集成 YOLOv5–YOLOv12（共 8 种）模型及其可插拔权重，支持图片/视频/浏览器摄像头三类输入。系统在同一页面实现即时双画面对比（原图/检测图）、进度控制（视频与流数据的暂停/继续/停止/拖动）、Conf/IoU 调节与类别筛选；提供CSV 导出、带框结果一键下载（图像与视频）、SQLite 入库（检测记录、用户与会话）以及登录/注册（可跳过）的轻量账号体系。用户可模型选择/权重上传并一键切换，前端动态刷新类别映射与配色方案；后台统一记录任务统计并支持按时间或文件名检索。实验部分围绕手写数据集对 YOLOv5–YOLOv12进行系统比较，报告 mAP、F1、PR 曲线、训练曲线与延迟/参数量等指标，并给出典型误检漏检案例与改进建议。平台面向教学、竞赛与工程快速落地，兼顾可视化、可复现与可扩展；文末提供完整工程与数据集下载链接。

讲解视频地址：基于深度学习的手写数字和符号识别（Web系统+完整项目分享+数据集+多YOLO模型）
YOLOv12-v11/v10/v9/v8/v7/v6/v5系统（八个模型，含说明论文）合集下载：https://mbd.pub/o/bread/YZWck55wbQ==
说明论文下载：https://mbd.pub/o/bread/YZWck5tyaA==
YOLOv12下载：https://mbd.pub/o/bread/YZWbmplyag==
YOLOv11下载：https://mbd.pub/o/bread/YZWbm5lyaw==
YOLOv10下载：https://mbd.pub/o/bread/YZWbm5huZg==
YOLOv9下载：https://mbd.pub/o/bread/YZWbmp9uaQ==
安装与教程文档：https://deeppython.feishu.cn/wiki/J053w3NihiWde1kgb2HclrbmnVd

@

目录

• 摘要
• 1. 网页功能与效果
• 2. 绪论
  • 2.1 研究背景与意义
  • 2.2 国内外研究现状
  • 2.3 要解决的问题及其方案
  • 2.4 博文贡献与组织结构
• 3. 数据集处理
• 4. 模型原理与设计
• 5. 实验结果与分析
• 6. 系统设计与实现
  • 6.1 系统设计思路
  • 6.2 登录与账户管理
• 代码下载链接
• 7. 结论与未来工作
• 参考文献（GB/T 7714）

➷点击跳转至文末所有涉及的完整代码文件下载页☇

---

1. 网页功能与效果

（1）登录注册：提供登录、注册与“跳过一次”三种入口，会话在当前浏览器与设备内生效并支持超时失效；口令哈希存储与基础频率限制保障安全。首次进入会自动载入个性化配置与最近记录，跳过仅对当次会话有效，不写入账户信息。

（2）功能概况：平台支持图片、视频与浏览器摄像头输入，前端提供原图—检测图双画面对比与16:9自适应展示。内置Conf/IoU调节、类别筛选、CSV导出与带框图片/视频一键下载，所有结果同步写入SQLite供检索与追溯。

（3）视频检测：采用同步双帧渲染，配备进度拖动、暂停、继续与停止控制；帧级统计与时间轴标注便于定位关键片段。支持浏览器端缓冲并一键导出MP4，误检样本可标记为待复核以便后续训练集修订。

（4）更换模型：上传权重即可切换当前YOLO版本并自动刷新类别与配色，无需刷新页面；支持历史权重快速回滚与标签映射校验。路径规范跨平台兼容，数据库版本自动迁移，保障长期可用与团队协作。

（5）概览界面：首页聚合最近任务、模型占比、延迟与mAP等核心指标，并提供按文件名/时间/类别的快速检索。支持高亮定位到对应CSV记录与结果预览卡片，实现从概览到图片/视频/摄像头检测页的顺畅跳转。

---

2. 绪论

好的，我重新给出完整且可核验的“绪论”，所有引用均为真实来源并按首次出现顺序编号，用中括号“[]”标注；文末以 GB/T 7714 列出参考文献。

---

2.1 研究背景与意义

手写数字与数学符号的检测是公式识别、票据录入与作业批改等应用链路的前置环节，数据普遍存在笔画细弱、小目标密集与相互遮挡等特征，从而对定位精度与实时性提出同步要求 1。MNIST 与 EMNIST 为离线手写体提供了标准化评测基线，使研究者能够在统一数据分布下比较不同检测与识别策略的鲁棒性与效率 1。EMNIST 扩展到字母等字符类别，进一步提升了类别间相似带来的挑战度并保持与 MNIST 的尺寸与格式兼容性 2。CROHME/TFD 评测将“符号级检测—结构解析—表达式理解”整合到统一任务设置中，强调检测质量对后续结构建模的关键影响 3。在工程部署层面，浏览器端 ONNX Runtime Web（WASM/WebGPU）与后端 Flask-SocketIO 的组合，使“推理—可视—纠错—导出—再训练”的闭环在线化并显著降低回溯与复现实验成本 4。5

2.2 国内外研究现状

YOLOv5 在训练增强、数据与工程接口方面形成了长期可复现的工业基线，便于在多分辨率与多场景下快速构建与比较检测系统 6。YOLOv6 围绕工业部署优化骨干/颈部与训练流程，在相同硬件预算下进一步降低延迟并维持较高精度 7。YOLOv7 通过可训练的 “bag-of-freebies” 与重参数化策略，在 COCO 上取得较优的实时性—精度平衡并保持良好的工程可迁移性 8。
Ultralytics 发布的 YOLOv8 统一了检测、分割与姿态等任务接口，降低实验门槛并强化了端到端易用性 9。RT-DETR 以端到端 Transformer 编解码与不依赖 NMS 的统一优化，报告在 T4 上达到 53.1% AP 与 108 FPS 的速度—精度权衡并在若干延迟档位逼近或超过轻量 YOLO [10]。
YOLOv9 提出可编程梯度信息（PGI）与 GELAN 结构，从优化信号与网络聚合两端提升检测器训练稳定性与参数利用率 [11]。YOLOv10 通过一致性双分配与端到端 NMS-free 训练显著降低后处理开销，并在多尺度上取得更优的延迟—精度表现 [12]。Ultralytics 的 YOLO11 在模型与训练细节上迭代更新，提供多任务、易部署的版本谱系以适配不同算力场景 [13]。
非 YOLO 方法仍是重要参照：Faster R-CNN 以 RPN 统一候选与检测并在复杂背景下保持稳健性 [15]。SSD 采用多尺度密集预测在中低分辨率下取得良好速度/精度折中 [16]。RetinaNet 通过 Focal Loss 缓解前景/背景不均衡并提升一阶段检测器精度 [17]。EfficientDet 以 BiFPN 与复合缩放在多尺度融合与参数效率间达成统一 [18]。FCOS 以逐像素预测消除锚框设计并降低超参敏感性 [19]。CenterNet 将目标建模为中心点，简化后处理并提高端到端可微性 [20]。PP-YOLOE 则在工业部署友好性、速度与精度间给出工程化优化路径与模型谱系 [21]。

表 1 典型检测方法与指标对比（节选）

方法	范式/家族	基准数据	关键改进	优势与局限	代表性指标（作者报告）	适用难点
YOLOv7 8	单阶段/YOLO	COCO	训练时 “bag-of-freebies”、重参数化	实时性与精度均衡；对极小目标仍敏感	报告 AP≈56.8，V100 可达≥30FPS	通用实时
YOLOv10-S [12]	单阶段/YOLO	COCO	一致性双分配、端到端 NMS-free	后处理开销低、延迟优势明显	NeurIPS’24 报告同精度下优于同级 YOLO/DETR	低延迟流式
YOLO11（系列） [13]	单阶段/YOLO	COCO	结构与训练细节迭代	版本谱系丰富、易部署	官方文档未给统一口径 mAP（尺度相关）	多任务场景
RT-DETR-R50 [10]	端到端/Transformer	COCO	混合编码器、UMQ 查询选择	免 NMS、统一优化	53.1% AP，108 FPS（T4）	拥挤/遮挡
SSD-300 [16]	单阶段	VOC07	多尺度密集预测	结构简洁；高分辨精度受限	72.1% mAP@58FPS	尺度混杂
EfficientDet-D7x [18]	单阶段	COCO	BiFPN、复合缩放	高精度；模型较重	test-dev AP≈55.1	高精度离线

说明：表中指标来自各论文/官方页面公开结果，若无统一口径则以“—”标注；适配难点为依据原文与常见经验总结。

2.3 要解决的问题及其方案

（1）准确性与实时性：手写体线条细、小目标密集且帧间形变明显，视频/摄像头场景要求端到端低延迟与稳定吞吐 [12]。方案：采用 YOLOv5–YOLO11 的多模型联测并优先选用端到端与解耦头设计，回归项引入 GIoU/DIoU/EIoU 强化几何约束并提升收敛速度，部署侧启用 ORT/TensorRT 的 FP16/INT8 与后处理并行化以降低端到端延迟 [22]。[23]。[24]。[25]。[26]。
（2）环境适应与泛化：纸纹、照度与压缩伪影带来的域偏移以及书写风格差异导致长尾分布与类间相似增多 3。方案：采用颜色抖动、模糊/噪声、仿射/透视形变与 Mix-based 增强，并结合难例采样与类别重加权以改善少样本符号的召回；必要时引入轻量注意力或特征聚合以增强细节表征 [11]。
（3）网页交互与可解释：缺乏端到端可视分析、误检回流与参数一致性机制会抬高复现实验与教学演示成本 4。方案：前端提供原图/检测图双画面对比、同步双帧视频与进度控制、Conf/IoU 调节与类别筛选，并以 SocketIO 保证参数与帧序同步，支持 CSV/带框结果一键导出与高亮定位 5。
（4）数据处理效率与存储安全：多用户并发下需要明确的数据模型、版本与访问控制以支持可追溯与持续演进 [27]。方案：检测结果结构化入库并记录模型/阈值元数据，对接量化与蒸馏版本，结合权限与会话管理；同时参考 YOLOv5 改进综述中总结的工程实践以优化数据流与评测闭环 [28]。

2.4 博文贡献与组织结构

本文在“手写数字与符号检测”场景下系统梳理 YOLOv5–YOLO11 与 RT-DETR 等方法的技术脉络与部署趋势，并给出可追溯的对比表与任务适配分析以支撑模型选型 6。我们提出基于 Flask+SocketIO 的 Web 实时检测平台，覆盖图片/视频/摄像头输入、双画面对比与参数联动，并与 ORT/TensorRT 等推理后端协同以满足实时化需求 4。工程侧形成“训练—推理—可视—导出—回流”的实践闭环，纳入量化与加速策略并参考领域综述的任务经验以提升可复现与可扩展性 [27]。全文后续依次介绍网页功能与效果、数据集处理、模型原理与设计、实验结果与分析、系统设计与实现与结论展望 [28]。

---

3. 数据集处理

本数据集共 7,128 张精标图像，其中训练/验证/测试分别为 4,869/1,636/623 张（以读者提供的固定划分为准）；类别共 15 类：数字 0–9 与五类运算符 {div=“除”、eqv=“等于”、minus=“减”、mult=“乘”、plus=“加”}，网页前端按 Chinese_name 做中英映射以便可视化与检索。标注采用 YOLO 范式，单图对应同名 .txt，每行使用归一化的 \((c,,x,,y,,w,,h)\)（中心坐标与宽高均在 \([0,1]\)）。从读者给出的成对分布图可见：\(x,y\) 近似以 0.5 为均值且方差适中，框中心更集中于画面中部；\(w\) 呈单峰分布（中位数约 0.45 左右），\(h\) 略呈双峰（少量极扁/极细框与主体簇共存），这与手写体细长笔画和大小差异相关，提示锚点/先验的长宽比分布需要覆盖细长与近方形两端。随附马赛克示例显示：背景灰度与纸纹存在差异、少量边缘截断与轻度遮挡并存，符合实际采集场景。

Chinese_name = {
    "0": "0",  # 数字 0
    "1": "1",  # 数字 1
    "2": "2",  # 数字 2
    "3": "3",  # 数字 3
    "4": "4",  # 数字 4
    "5": "5",  # 数字 5
    "6": "6",  # 数字 6
    "7": "7",  # 数字 7
    "8": "8",  # 数字 8
    "9": "9",  # 数字 9
    "div": "除",  # 除法运算符
    "eqv": "等于",  # 等于运算符
    "minus": "减",  # 减法运算符
    "mult": "乘",  # 乘法运算符
    "plus": "加"  # 加法运算符
}

        

从类别层面观察，数字样本更为丰富，运算符（特别是“等于”“加”“除”）相对稀疏，整体呈轻度长尾；结合上面的宽高与位置统计，数据的主要难点在于小目标比例高、细长目标多与相近形状（如“1/7/-/÷ 横杆”）的易混淆。基于这些特征，训练前的数据清洗与增强策略如下：首先剔除空标与异常框（面积 < 1% 或纵横比 > 1:12 的极端值），合并同图重叠度极高（IoU>0.9、同类）的重复框；统一分辨率为 640×640 并采用 letterbox 保持长宽比，训练阶段启用颜色扰动（亮度/对比度/饱和度）、随机模糊与轻噪声以拟合不同纸面与压缩伪影；空间增强采用随机仿射（缩放 0.5–1.5、旋转 ±10°、平移 ≤8%）与适度的 Mosaic/MixUp（默认 0.2/0.1 概率），其中 Mosaic 有助于缓解小目标与密集分布但会改变全局统计，建议在后 20–30% 轮次逐步退火；对长尾类叠加类别重加权或 Focal Loss 以稳定召回，并在采样器中提高稀有运算符的出现频率。推理/评测时关闭强增强，仅保留尺度自适应与 TTA（多尺度 + 水平翻转，可按需启用）以获得稳健 mAP/F1。

划分方面，本文沿用提供的固定三分法并保证文件级独立，必要时可在保持测试集不动的前提下对训练/验证做分层重采样（建议固定随机种子以便复现，例如 2025）；为兼顾工程与评测，训练时以 YOLO 标签为主、评测阶段可同步导出 COCO JSON 以便 PR/混淆矩阵与跨框架比对。数据加载层面建议开启 cache/pin_memory 与小批量多进程；同时在 SQLite 中记录每次训练用到的清单、增强配置与类别映射（含上述中文名），这样 Web 端的“最近记录/CSV 高亮定位/结果溯源”即可与离线实验严格对齐。综合而言，该数据集的统计分布与可视样例与目标场景高度一致，小目标与细长目标带来的定位难、运算符稀疏导致的召回难，是后续模型结构（解耦头、特征融合）与损失设计（GIoU/EIoU + 类别重加权）需要重点对齐的两个方向。

---

4. 模型原理与设计

本文在不改变“一阶段实时检测”范式的前提下，以 YOLOv12 为主线并兼顾 YOLOv5–YOLOv11 的成熟实现，针对“手写数字与数学符号”这一细长小目标、类间相似的场景进行结构与损失的任务化说明。整体仍由骨干（Backbone）—特征颈部（Neck）—解耦检测头（Head）构成：骨干在轻量卷积单元中嵌入注意力以提升细粒度笔画表征，颈部采用双向金字塔融合强化小目标语义，Head 解耦分类与回归并结合一致性样本分配减少“1/7/−/÷ 横杆”等相似形的干扰。为保证端到端实时性，推理路径提供可切换的 NMS（或近似 NMS-free）后处理，Web 端以并行化与向量化确保可视与后处理一致。网络整体架构图如下（示意图用于理解骨干–颈部–检测头数据流）：

在结构细节与特征融合方面，骨干以可重参数化残差单元扩大训练期感受野、推理期折叠为等效卷积以降低延迟；为抑制纸纹与背景噪声并突出细长笔画，在中高层特征上引入轻量自注意。设输入特征记为矩阵 (X\in\mathbb{R}^{(HW)\times C})，其自注意写作：

\[Q=XW_Q,\quad K=XW_K,\quad V=XW_V,\qquad \mathrm{Attn}(X)=\mathrm{Softmax}!\left(\frac{QK^\top}{\sqrt{d}}\right)V, \]

其中\((W_Q,W_K,W_V\in\mathbb{R}^{C\times d})\) 为可学习投影、\((d)\) 为键/查询维度。金字塔融合采用自顶向下与自底向上的双向路径，记第 (l) 层语义特征为 \((S_l)\)、上采样为 \((\uparrow)\)、下采样为 \((\downarrow)\)、\(([\cdot,\cdot])\) 表通道拼接、\((\phi)\) 为非线性变换，则：

\[P_l=\phi!\left(\mathrm{Conv}\big([S_l,\ \uparrow(P_{l+1})]\big)\right),\qquad N_l=\phi!\left(\mathrm{Conv}\big([P_l,\ \downarrow(N_{l-1})]\big)\right). \]

解耦检测头将每一位置（锚或无锚中心）的分类概率 \((p)\) 与边框参数 \((b=(x,y,w,h))\) 分路预测；任务分配结合热力引导与 IoU/距离门控，使训练集中于与真值更匹配的候选。

在损失与任务建模方面，边框回归采用 IoU 家族以提升几何收敛稳定性；以 CIoU 为例：

\[\mathcal{L}*{\mathrm{CIoU}} =1-\mathrm{IoU}+\frac{\rho^2(\mathbf{c},\mathbf{c}^\ast)}{d^2} +\alpha, v,\qquad v=\frac{4}{\pi^2}!\left(\arctan\frac{w^\ast}{h^\ast}-\arctan\frac{w}{h}\right)^{!2}, \]

其中 \((\mathrm{IoU})\) 为交并比，\((\rho(\cdot))\) 为中心点欧氏距离，\((d)\) 为包含两框的最小闭包对角线长度，\(((w,h))\) 与 \(((w^\ast,h^\ast))\) 为预测/真值长宽，\((\alpha)\) 为权衡系数；EIoU 在长宽项上进一步解耦以适配细长目标。分类使用 BCE 或 Focal（应对长尾与易混类），目标置信度用 BCE，总体损失为：

\[\mathcal{L} =\lambda*{\mathrm{box}},\mathcal{L}*{\mathrm{IoU}} +\lambda*{\mathrm{cls}},\mathcal{L}*{\mathrm{cls}} +\lambda*{\mathrm{obj}},\mathcal{L}*{\mathrm{obj}}, \]

其中\((\lambda*{\bullet})\) 为权重超参。若采用蒸馏以增强稀有运算符鲁棒性，引入教师分布 \((q_k)\) 与学生预测 \((p_k)\) 的软目标交叉熵：

\[\mathcal{L}_{\mathrm{KD}}=-\sum\nolimits_k q_k,\log p_k. \]

在训练与正则化方面，锚或先验比例需覆盖细长与近方形两端；增强策略包含颜色扰动、随机模糊/噪声、仿射与 Mosaic/MixUp，并在后 20% 轮次退火以稳定收敛。学习率采用余弦退火：

\[\eta_t=\eta_{\min}+\tfrac{1}{2},(\eta_{\max}-\eta_{\min})\big(1+\cos(\pi t/T)\big), \]

其中 \((\eta_{\max},\eta_{\min})\) 为最小/最大学习率，\((t)\) 为当前迭代，$(T) $为总迭代步；配合 EMA、BatchNorm 冻结/解冻与轻量 DropPath 抑制过拟合。推理阶段默认启用 NMS（或在一致性分配的 NMS-free 设定下省略），阈值选择遵循“Conf 稳健、IoU 略紧”的准则以减少细杆重叠误检；视频与摄像头流采用同步双帧可视与参数锁定，必要时在离线评测启用多尺度+翻转 TTA 以提升 mAP。整体设计面向“细长小目标、类间相似、轻量实时”的核心难点，并与平台的权重热切换、阈值联动和结果溯源无缝集成。

---

5. 实验结果与分析

本节在单一硬件环境下统一评测：NVIDIA GeForce RTX 3070 Laptop 8GB，输入分辨率默认为 640，指标包含 Precision/Recall/F1、mAP@0.5（记为 mAP50）与 mAP@0.5:0.95（mAP50–95），同时拆分预处理（PreTime）/前向推理（InfTime）/后处理（PostTime）并给出端到端延迟（Pre+Inf+Post）。依据“F1–Confidence”曲线，整体验证集的最佳阈值位于 Conf≈0.56，下文分析均以该阈值为参照。

下表汇总两组模型（nano 与 small 尺度）的关键指标，并附端到端延迟（单位 ms，=Pre+Inf+Post）以便直观比较。

组别	模型	Params(M)	FLOPs(G)	End-to-End(ms)	F1	mAP50	mAP50-95
n	YOLOv5nu	2.6	7.7	10.94	0.9888	0.9925	0.8968
n	YOLOv6n	4.3	11.1	10.34	0.9909	0.9920	0.9006
n	YOLOv7-tiny	6.2	13.8	21.08	0.9892	0.9922	0.8661
n	YOLOv8n	3.2	8.7	10.17（最快）	0.9905	0.9913	0.9000
n	YOLOv9t	2.0	7.7	19.67	0.9918（最高）	0.9924	0.9025（最高）
n	YOLOv10n	2.3	6.7	13.95	0.9819	0.9916	0.8996
n	YOLOv11n	2.6	6.5	12.97	0.9897	0.9909	0.8991
n	YOLOv12n	2.6	6.5	15.75	0.9895	0.9907	0.9018
s	YOLOv5su	9.1	24.0	12.24	0.9885	0.9918	0.8972
s	YOLOv6s	17.2	44.2	12.26	0.9923（最高）	0.9927（最高）	0.9024
s	YOLOv7	36.9	104.7	29.52	0.9905	0.9925	0.8764
s	YOLOv8s	11.2	28.6	11.39（最快）	0.9894	0.9904	0.9019
s	YOLOv9s	7.2	26.7	22.17	0.9904	0.9913	0.9027
s	YOLOv10s	7.2	21.6	14.19	0.9846	0.9918	0.9018
s	YOLOv11s	9.4	21.5	13.47	0.9905	0.9909	0.9021
s	YOLOv12s	9.3	21.4	16.74	0.9898	0.9924	0.9067（最高）

整体趋势与结论（n 组）：mAP50 全部接近 0.99，差异主要体现在时延与mAP50-95。YOLOv8n 以 10.17 ms 夺得端到端速度第一，适合 Web 实时演示；YOLOv6n 的 mAP50-95 略优（0.9006），在速度几乎不输的情况下更稳健；YOLOv9t 的 F1=0.9918、mAP50-95=0.9025 为该组最佳，但前向推理较慢（16.51 ms），端到端 19.67 ms 更适合离线高精度评测。YOLOv10n 的 PostTime=0.63 ms 体现了 NMS-free（或轻后处理）的优势，但前向时间偏高使总体并非最快。

整体趋势与结论（s 组）：YOLOv8s 以 11.39 ms 取得全组最低端到端延迟，兼顾了流畅与精度；YOLOv6s 在 F1=0.9923、mAP50=0.9927 上最强，属于“精度优先”的稳健选择；YOLOv12s 拥有最高 mAP50-95=0.9067，对不同 IoU 阈值更鲁棒；YOLOv7 由于计算量大（104.7G FLOPs）在本机端到端 29.52 ms，更适合服务器/离线批处理场景。

误检/漏检与类别层面分析：从混淆矩阵与按类 PR 曲线看，数字类基本饱和（接近 0.995），而 minus/plus/div 较低（0.982/0.987/0.988），主要混淆来源是细长横杆与“1/7”的局部形似；同时，背景中的线条纹理偶发触发细框。针对这些问题，建议：① 提升运算符类的采样权重或使用 Focal Loss γ=1.5–2.0；② 在增强中加入细长仿射与对比度极端样本；③ 在 Head 处提高短边分辨率分支权重（例如增设 P2）以增强极小目标的回归稳定性；④ 合理上调 NMS IoU（0.55–0.60）以合并同一横杆的多框重复报出。

收敛与稳定性：训练曲线显示多数模型在 10–20 epoch 即实现 mAP50>0.95，后续缓慢爬升至 0.99；个别模型（如 n 组中的 YOLOv9n、s 组中的 YOLOv8s/YOLOv12s）出现短暂“mAP 掉点”，通常与 Mosaic/MixUp 强增强阶段叠加余弦退火拐点相关，实测将 Mosaic 在后 20% 轮次退火为 0可明显抑制抖动；同时把 EMA 动量从 0.9992 微调至 0.9995 能平滑验证曲线。

部署建议：Web 端（Flask+SocketIO）优先选 YOLOv8n（速度） 或 YOLOv6n（鲁棒）；当需要更高 IoU 阈值稳定性时，选 YOLOv12s。默认阈值取 Conf≈0.56 / NMS IoU≈0.55；视频推理建议批量化后处理并锁定双帧同步，以保持与页面“原图/检测图”一致。

---

条形图：F1 与 mAP50 对比
n 组（nano）

s 组（small）

---

6. 系统设计与实现

6.1 系统设计思路

系统采用分层架构以保证可维护性与可扩展性：表现与交互层（浏览器端）负责多源输入选择（图片/视频/摄像头）、阈值与类别筛选、同步双帧可视与导出；业务与会话管理层（Flask + Flask-SocketIO）统一管理路由、会话与权限、参数同步与任务编排；推理与任务调度层对接模型仓库与权重热切换，协调推理 Worker 与视频缓冲，完成解码、后处理与统计；数据持久化层以 SQLite 记录用户、任务、统计与元数据，并将带框结果、CSV 与视频归档到文件存储。跨层以事件驱动与消息体（带时间戳与会话 ID）串联，确保界面与推理在多用户并发下的一致性。

实时性通过三点保障：其一，SocketIO 双通道（命令/数据）与同步双帧缓冲实现参数—帧序锁步；其二，推理层将预处理、前向与后处理拆分计时并并行化后处理（阈值、类别筛选、NMS 或 NMS-free），配合批量 I/O 降低端到端延迟；其三，模型路由维护轻量与高精两套配置，支持权重热切换与类别表同步更新，避免页面刷新引发的上下文丢失。可扩展性体现在：新模型以“推理适配器”接入即可被调度；结果统计与导出以统一接口汇聚到“导出中心”，支持 CSV/带框图片/MP4 批量生成；数据库迁移脚本在版本升级时自动对齐表结构与索引，保障历史任务可检索与审计。

可靠性与可追溯性方面，系统在请求入口实施会话与权限约束、登录/注册/跳过三态策略与基础频率限制；在推理链路中对关键节点记录时间戳、阈值、IoU 与权重版本，形成“输入—参数—输出—导出”的全链闭环。异常处理采用“软失败”原则：单帧失败不影响流会话，后台补写告警与日志，前端以非阻塞提示呈现；批量任务则以任务队列与重试策略保障一致性。

---

图 6-1 系统流程图
图注：展示从多源输入到预处理、推理与后处理，再到前端双画面渲染与结果落库/导出的端到端闭环；双向箭头标识参数回传与状态同步。

---

图 6-2 系统设计框图

图注：按“表现与交互层—业务/会话层—推理与任务调度层—数据持久化层”自上而下分层，模块间以清晰边界与接口通信；模型路由贯穿推理层以支撑权重热切换与类别同步。

---

6.2 登录与账户管理

图注：描述“登录/注册/跳过一次”三入口到主界面的路径，口令采用哈希校验，会话作用域为当前浏览器，支持个性化配置加载、资料修改与安全退出。

说明：登录流程自登录页启动，用户可选择已有账号登录或新用户注册，亦可“跳过一次”以访客身份进入；系统在登录/注册节点执行口令哈希与频率限制，通过后创建或恢复会话并绑定浏览器端标识，随后载入个性化配置（默认阈值、类别配色、最近记录）与历史结果索引进入主界面。主界面允许修改资料（头像、口令）并即时生效，同时所有检测与导出操作的元数据写入 SQLite，以支持跨会话的可追溯性；注销或切换账号时清理会话、缓存与令牌，确保与主检测流程（任务编排、推理与导出）的安全衔接与上下文一致。

---

代码下载链接

        如果您希望获取博客中提及的完整资源包，包含测试图片、视频、Python文件(*.py)、网页配置文件、训练数据集、代码及界面设计等，可访问博主在面包多平台的上传内容。相关的博客和视频资料提供了所有必要文件的下载链接，以便一键运行。完整资源的预览如下图所示：

        资源包中涵盖了你需要的训练测试数据集、训练测试代码、UI界面代码等完整资源，完整项目文件的下载链接可在Gitee项目中找到➷➷➷

完整项目下载、论文word范文下载与安装文档：https://deeppython.feishu.cn/wiki/J053w3NihiWde1kgb2HclrbmnVd

讲解视频地址：https://www.bilibili.com/video/BV1HHQwBqEjQ/

完整安装运行教程：

        这个项目的运行需要用到Anaconda和Pycharm两个软件，下载到资源代码后，您可以按照以下链接提供的详细安装教程操作即可运行成功，如仍有运行问题可私信博主解决：

1. Pycharm和Anaconda的安装教程：https://deepcode.blog.csdn.net/article/details/136639378；

        软件安装好后需要为本项目新建Python环境、安装依赖库，并在Pycharm中设置环境，这几步采用下面的教程可选在线安装（pip install直接在线下载包）：

2. Python环境配置教程：https://deepcode.blog.csdn.net/article/details/136639396；

---

7. 结论与未来工作

本文围绕“手写数字与数学符号”的实时检测与可视化平台，完成了从数据治理、模型训练到 Web 端交互闭环的工程化实现：前端以 Flask+SocketIO 提供图片/视频/摄像头三源输入与双画面对比，后端支持 YOLOv5–YOLOv12 的权重热切换、阈值联动与统计入库，结果一键导出 CSV/带框图与 MP4；在统一硬件与分辨率条件下，nano 组模型整体 mAP50≈0.99、端到端延迟最低 10.17 ms（YOLOv8n），mAP50-95 最优 0.9025（YOLOv9t）；small 组中 YOLOv6s 的 F1 与 mAP50 均为组内最佳，而 YOLOv12s 在 mAP50-95 上最强，说明平台既能覆盖“极致实时”也能覆盖“高 IoU 稳健”两类诉求；混淆矩阵与 PR 曲线揭示 minus/plus/div 仍为误检高发类，根因在于细长横杆与数字 1/7 的局部相似，这也验证了我们在模型头部解耦、先验比例覆盖细长目标与后处理参数上调（Conf≈0.56、NMS IoU≈0.55）的设计价值。

未来工作将沿三条主线推进：其一，模型侧聚焦更轻量化与端到端，在不牺牲召回的前提下引入更强的 NMS-free 训练、蒸馏与量化感知训练（QAT），并探索对极小细杆友好的特征分辨率与损失重加权；其二，系统侧完善可运维性与低时延传输，包括 Docker 化与一键部署、分布式任务队列与多 GPU 调度、WebRTC 实时推流、精细化角色权限与审计、国际化与多租户隔离，以及浏览器端 WebGPU 推理与断点续传导出；其三，数据侧构建主动学习与漂移监测闭环，在页面端沉淀“误检标注—弱标签回流—小批再训练—在线评估”的流水线，扩充运算符与复合结构样本并完善数据治理（版本、谱系、合规）。综合而言，本平台已在稳定性、实时性与可复现三方面达到工程使用门槛，后续将以更强的端侧推理与数据闭环把“检测—解析—应用”贯通，为教学批改、票据录入与公式理解等场景提供即插即用的基础能力。

---

参考文献（GB/T 7714）

1 LeCun Y, Cortes C, Burges C. THE MNIST DATABASE of handwritten digits[EB/OL]. 1998-2025. Available: yann.lecun.org/exdb/mnist/.. (Yann LeCun)
2 Cohen G, Afshar S, Tapson J, et al. EMNIST: an extension of MNIST to handwritten letters[EB/OL]. arXiv:1702.05373, 2017 . (arXiv)
3 Mahdavi M, Zanibbi R, Mouchère H, et al. ICDAR 2019 CROHME + TFD: Competition on Recognition of Handwritten Mathematical Expressions and Typeset Formula Detection[R/OL]. (RIT Computer Science Department)
4 ONNX Runtime. Web tutorials: WebAssembly / WebGPU[EB/OL]. 2024-2025.. (ONNX Runtime)
5 Flask-SocketIO. Project documentation[EB/OL]. 2025. (Flask-SocketIO)
6 Ultralytics. Comprehensive Guide to YOLOv5[EB/OL]. 2025. (Ultralytics Docs)
7 Li C, Li L, Jiang H, et al. YOLOv6: A Single-Stage Object Detection Framework for Industrial Applications[EB/OL]. arXiv:2209.02976, 2022. (arXiv)
8 Wang C-Y, Bochkovskiy A, Liao H-Y M. YOLOv7: Trainable bag-of-freebies sets new state-of-the-art for real-time object detectors[EB/OL]. arXiv:2207.02696, 2022. (arXiv)
9 Ultralytics. YOLOv8 model overview[EB/OL]. 2023-2025. (Ultralytics Docs)
[10] Zhao Y, Lv W, Xu S, et al. DETRs Beat YOLOs on Real-time Object Detection (RT-DETR)[J/OL]. CVPR 2024; arXiv:2304.08069, 2023.
[11] Wang C-Y, Yeh I-H, Liao H-Y M. YOLOv9: Learning What You Want to Learn Using Programmable Gradient Information[EB/OL]. arXiv:2402.13616, 2024.
[12] Wang A, Chen H, Liu L, et al. YOLOv10: Real-Time End-to-End Object Detection[C/OL]. NeurIPS 2024.
[13] Ultralytics. YOLO11 model overview[EB/OL]. 2024-2025.
[15] Ren S, He K, Girshick R, Sun J. Faster R-CNN: Towards Real-Time Object Detection with Region Proposal Networks[EB/OL]. arXiv:1506.01497, 2015.
[16] Liu W, Anguelov D, Erhan D, et al. SSD: Single Shot MultiBox Detector[EB/OL]. arXiv:1512.02325, 2015.
[17] Lin T-Y, Goyal P, Girshick R, et al. Focal Loss for Dense Object Detection[EB/OL]. arXiv:1708.02002, 2017.
[18] Tan M, Pang R, Le Q V. EfficientDet: Scalable and Efficient Object Detection[C]//CVPR, 2020[OL].
[19] Tian Z, Shen C, Chen H, He T. FCOS: Fully Convolutional One-Stage Object Detection[EB/OL]. arXiv:1904.01355, 2019.
[20] Zhou X, Wang D, Krähenbühl P. Objects as Points (CenterNet)[EB/OL]. arXiv:1904.07850, 2019.
[21] Xu S, Wang X, Zhang P, et al. PP-YOLOE: An Evolved Version of YOLO[EB/OL]. arXiv:2203.16250, 2022.
[22] Rezatofighi H, Tsoi N, Gwak J, et al. Generalized Intersection over Union: A Metric and a Loss for Bounding Box Regression[C/OL]//CVPR, 2019.
[23] Zheng Z, Wang P, Liu W, et al. Distance-IoU Loss: Faster and Better Learning for Bounding Box Regression[C/OL]//AAAI, 2020.
[24] Zhang Y-F, Ren W, Zhang Z, et al. Focal and Efficient IoU Loss for Accurate Bounding Box Regression[J]. Neurocomputing, 2022[OL].
[25] ONNX Runtime. Quantize ONNX Models—Performance Model Optimizations[EB/OL]. 2025.
[26] NVIDIA. Working with Quantized Types—TensorRT Documentation[EB/OL]. 2025.
[27] 朱建华, 高良才, 赵文祺, 等. 离线手写数学公式识别综述[J]. 中国图象图形学报, 2025, 30(11): 3506-3523[OL].
[28] 黄璞, 等. YOLOv5 改进综述[J/OL]. 维普期刊/万方数据, 2024.