AI Agent & RAG 平台系统架构

技术栈:Vue3 + SpringBoot + Django + vLLM + Milvus + MinIO | 移动端上传策略 & 技术选型

一、整体架构分层

前端层

  • 主方案:Vue3 + Vite H5,一套代码支持 PC管理后台 + 移动端H5巡检页面
  • PC端:知识库管理、文档上传、RAG调试、Agent任务监控、多租户权限、报告预览
  • 移动端H5:弱网IndexedDB离线缓存、拍照上传、AI问答、识别结果查看、态势面板
  • 备选方案:Flutter(原生跨端,仅在特定重度上传场景启用)

业务接入层(SpringBoot Java,生产高并发)

  • 承接用户请求、租户隔离、RBAC权限、分布式任务调度、接口限流熔断
  • 大文件分片上传、断点续传、任务队列管理,对接AI能力中台
  • 生产环境主业务后台,高并发稳定承接前端流量

AI原型验证层(Django Python)

  • 快速迭代验证核心AI能力:RAG检索、多Agent编排、VLM多模态、文档解析、工具调用
  • LangGraph Agent编排、RAGAS评测、文档版面解析(LayoutLM/OCR)
  • 仅用于原型、实验调试;生产业务流量由SpringBoot承载

vLLM 模型推理层(高并发LLM/VLM服务)

  • 基于vLLM PagedAttention,实现LLM、VLM多模态推理,高吞吐、低延迟
  • 部署方案:K8s容器化,GPU多卡分片,推理实例水平扩容
  • 请求队列管理、动态批处理、KV Cache复用,应对问答、图片识别并发请求
  • 和AI中台解耦,提供标准化OpenAI兼容接口,供Agent/RAG调用

存储 & 向量引擎层

  • Milvus:向量库,RAG向量检索;PostGIS:空间业务数据;Redis:缓存+分布式锁
  • MinIO:对象存储,图片、PDF文档、巡检照片存储,支持分片上传
  • PostgreSQL:业务、租户、任务元数据

二、移动端拍照上传:慢的根本原因分析

核心结论:不是H5本身慢,大多是上传策略设计问题。

  • 原图直传:手机12MP照片5~10MB,4K视频可达数百MB,原始文件体积过大
  • 单连接串行上传:单文件串行传输,一旦断网需要全部重传
  • 无前端压缩:拍照后未做尺寸压缩、格式转码
  • 未分片:大文件不切片,单次请求失败全部作废
  • 弱网盲目重试:网络抖动就无限重试,加剧上行拥堵

野外场景:广州野外机器人4G上行带宽仅 1~2Mbps,10MB原图理论就要40~80秒。这是带宽物理瓶颈,Flutter也无法突破。

H5上传优化方案(全部原生JS能力实现)

优化点 实现做法 效果
图片压缩 Canvas压缩到1920px宽,输出WebP,质量0.8 10MB原图 → 1~2MB,速度提升约5倍
分片上传 分片大小2~5MB,并发3片同时上传 断网仅重传失败分片,无需全部重传
断点续传 IndexedDB记录已上传分片索引,网络恢复继续上传 中断后恢复,不从头开始上传
后台上传队列 IndexedDB维护上传任务队列,切页面不中断任务 用户可继续操作页面,上传后台异步执行
缩略图优先策略 先上传200px缩略图给AI快速预览识别,原图后台异步补传 巡检人员秒级看到AI识别结果,不需要等待原图上传完成
弱网自动降级 2G/3G环境自动降低分辨率,仅上传关键帧 弱网环境页面不卡死,保障基础业务可用

这套优化全部基于H5原生能力实现,完成后野外巡检拍照上传体验完全满足当前业务需求。PRD补充:缩略图优先 + 前端压缩 + 并发分片。

三、移动端技术选型对比:Vue3 H5 VS Flutter

对比项 Vue3 H5(主方案) Flutter(备选方案)
开发成本 ✅ 低,复用现有前端团队,一套代码PC+H5,无需额外学习新语言 ❌ 高,需要学习Dart;独立Flutter工程,与Vue代码无法复用
拍照 & 大文件上传 ✅ 优化后可用:Canvas压缩、并发分片、断点续传、IndexedDB任务队列;
限制:浏览器后台/锁屏时JS线程可能被系统挂起
✅ 原生能力强:后台保活上传;原生相机相册API,EXIF处理更稳定;大视频流式上传内存占用更低
离线能力 IndexedDB做离线缓存;页面切后台复杂本地任务容易被系统回收 原生SQLite,离线存储可靠性更高,后台任务保活
打包交付 无需打包App,浏览器直接访问,迭代发布无需应用商店审核 可打包Android/IOS安装包;版本更新需要App发布流程
硬件交互 蓝牙、串口、外设支持有限 原生支持蓝牙、串口、硬件外设对接
适用场景建议 优先采用:巡检频次不高,拍照间隔几分钟一次;快速迭代,不想维护多端App。
通过前端压缩+分片+缩略图优先策略解决野外弱网上传问题。
作为备选:仅当业务达到「连续拍摄50张照片+多段视频,锁屏后台持续上传半小时」场景,或者需要对接蓝牙/串口硬件时,才考虑切换Flutter。

Flutter独有优势要点总结

  • 后台持续上传:H5锁屏/切后台JS线程易被杀;Flutter原生后台服务可保活完成上传
  • 原生相机相册:直接调用系统API,拍照、压缩、EXIF处理稳定性更好
  • 大文件流式上传:文件不一次性载入内存,传输500MB大视频不易崩溃
  • 离线存储:原生SQLite,相比IndexedDB可靠性更高
  • 硬件能力:原生支持推送、蓝牙、串口,可对接机器人手柄、蓝牙打印机

切换触发条件:野外巡检连续拍摄50张照片+多段视频,需要锁屏后台持续上传半小时;原型/面试阶段业务量未达到,无需上Flutter。

选型最终结论:现阶段优先使用 Vue3 H5 作为主方案,实施全套前端上传优化策略;Flutter 保留为备选技术方案。当前原型、面试阶段业务量级,完全不需要切换Flutter。Flutter不是银弹,无法解决带宽物理瓶颈。

四、高并发整体方案小结