hhs
a04275cc76
- 新建 01-架构设计.md：合并项目概述+系统架构+持久化设计，含 Mermaid 架构图、模块图、时序图、ER 图、部署图 - 新建 02-接口文档.md：合并接口文档+持久化 API+用户模块 API，统一格式去重 - 重编号 03~09，去掉状态标注，规划中功能标记为待实现 - 删除 PLAN_BACKEND.md、PLAN_USER_MODULE.md 及冗余文档
2.7 KiB
2.7 KiB
视觉理解
概述
从摄像头视频流到 AI 语义理解的技术链路：帧采样 → 图像编码 → 多模态 LLM → 语义结果。
摄像头每秒 30 帧，全部送入 LLM 不现实也不经济，帧采样是第一个需要解决的问题。
帧采样策略
| 策略 | 原理 | 适用场景 |
|---|---|---|
| 固定间隔采样 | 每 N 秒取一帧 | 画面变化缓慢 |
| 关键帧检测 | 对比相邻帧差异，变化超阈值时触发 | 画面动态变化较多 |
| 事件驱动采样 | 用户主动触发（如拍照按钮） | 精确提问场景 |
| 混合策略 | 低频定时 + 高频事件触发 | 通用推荐方案 |
关键帧检测核心逻辑（TypeScript 实现，EdgeProcessor/index.tsx）：
// 降低分辨率到 160x120 做检测，兼顾速度与精度
const DETECT_WIDTH = 160;
const DETECT_HEIGHT = 120;
function calcSimilarity(prev: ImageData, curr: ImageData): number {
const pixelCount = prev.width * prev.height;
let diffSum = 0;
// 只比较 RGB 三通道，跳过 Alpha
for (let i = 0; i < prev.data.length; i += 4) {
diffSum += Math.abs(prev.data[i] - curr.data[i])
+ Math.abs(prev.data[i+1] - curr.data[i+1])
+ Math.abs(prev.data[i+2] - curr.data[i+2]);
}
const avgDiff = diffSum / (pixelCount * 3);
return 1 - avgDiff / 255; // 相似度：1 = 完全相同，0 = 完全不同
}
阈值说明：
- 对话模式：
similarity > 0.9时跳过（视为重复帧） - 观察模式：
similarity < 0.85时触发变化回调
图像编码与多模态输入
主流多模态 LLM（GPT-4o、Claude）接受图片的两种方式：
| 方式 | 适用场景 |
|---|---|
| Base64 内联 | 本地/实时场景 |
| URL 引用 | 已有图床的场景 |
OpenAI 兼容接口调用示例：
const response = await openai.chat.completions.create({
model: "gpt-4o",
messages: [
{
role: "user",
content: [
{ type: "text", text: "请描述画面中的内容" },
{
type: "image_url",
image_url: {
url: `data:image/jpeg;base64,${base64Image}`,
detail: "low" // "low" | "high" | "auto"
}
}
]
}
]
});
detail 参数影响：
low：65x65 缩略图，约 85 tokens，适合快速识别high：按 512px 方块切分，细节丰富但 token 数激增- 实时对话场景建议默认
low，仅在用户追问细节时切换high
视觉理解的局限性
- 运动模糊：快速移动物体在低帧率下容易模糊
- 光线变化：逆光、暗光环境下识别率显著下降
- 细小文字：低分辨率下 OCR 能力受限
- 空间推理：精确的距离、尺寸判断仍是短板