视觉识别算法demo

AI 视觉监控

1. 概述

项目的构建需求来源是：因为项目紧急的需要，需提供一个可以对视频信息进行分析的算法，需要对视频中的给定区域进行监控，如果有车辆驶入，需要能告警，但是项目本身没有什么高端硬件，就是平常的CPU虚拟机，加上人手（没人）和时间（两天）原因就快速的搭建了这个项目。项目本身存在诸多使用场景限制，首先调用了云端的视觉大模型，其次仅针对定向摄像头（一个方位，不考虑摄像头移动）。基于以上要求，因为仅有两天的时间，因此就构想了使用视觉大模型来解决这个问题，项目提供后台，可以先对视频中的某一帧图像进行相关区域的划分，然后可以通过接入视频流、抽取视频帧的方式进行问答，本项目在开发之处是使用了"车辆驶入告警"这一案例进行的测试、分析。当然，实际的场景还有很多，可以根据prompt的方式去驱动分析。在"video"文件夹中放置了测试用的视频，在实际使用过程中需要自己实现视频流的接入，并且进行抽帧（抽帧间隔最好不要小于5秒，因为要考虑到AI的输出效率）。系统提供了两个模块："站点管理"和"视频分析"，"视频分析"模块仅是为了测试所用，真正使用中，该模块实际是在项目上去实现，然后调用本项目提供的分析接口。

1.2 核心功能

功能模块	功能描述
站点配置管理	支持多站点配置，每个站点可独立设置监控区域和检测规则
多边形区域标记	通过前端界面绘制多边形区域，标记监控范围
违规检测规则	支持两种检测规则：`in_bounds`（必须在框内）和 `no_entry`（禁止入内）
视频帧分析	对视频帧进行智能分析，检测车辆是否违规
AI智能分析	基于阿里云Qwen-VL视觉大模型，提供高精度的违规检测

### 1.3 技术特点

前后端分离架构：后端提供RESTful API，前端使用Vue 3构建
轻量级数据库：使用SQLite数据库，无需额外安装数据库服务
多边形区域可视化：将监控区域以透明红色填充的方式绘制在图片上
灵活的Prompt配置：支持自定义分析提示词，满足不同场景需求
跨域支持：内置CORS中间件，支持跨域请求

2. 技术架构

2.1 系统架构图

复制代码

┌─────────────────────────────────────────────────────────────┐
│                        前端 (Vue 3)                          │
│  ┌─────────────┐  ┌─────────────┐  ┌─────────────┐         │
│  │  站点管理    │  │  视频分析    │  │  结果展示    │         │
│  └─────────────┘  └─────────────┘  └─────────────┘         │
└──────────────────────────┬──────────────────────────────────┘
                           │ HTTP/HTTPS
                           ▼
┌─────────────────────────────────────────────────────────────┐
│                     后端 (FastAPI)                           │
│  ┌─────────────┐  ┌─────────────┐  ┌─────────────┐         │
│  │  站点API     │  │  分析API     │  │  图像处理    │         │
│  └─────────────┘  └─────────────┘  └─────────────┘         │
└──────────────────────────┬──────────────────────────────────┘
                           │
        ┌──────────────────┼──────────────────┐
        ▼                  ▼                  ▼
┌─────────────┐    ┌─────────────┐    ┌─────────────┐
│   SQLite    │    │  OpenCV     │    │  DashScope  │
│   数据库     │    │  图像处理    │    │  AI服务     │
└─────────────┘    └─────────────┘    └─────────────┘

2.2 后端技术栈

技术	版本	用途
Python	3.10+	编程语言
FastAPI	latest	高性能Web框架
SQLModel	latest	ORM框架
SQLite	-	轻量级数据库
OpenCV	latest	图像处理库
Pillow	latest	图像处理库
DashScope	latest	阿里云AI服务SDK
Uvicorn	latest	ASGI服务器

2.3 前端技术栈

技术	版本	用途
Vue	3.x	渐进式JavaScript框架
TypeScript	5.x	类型安全的JavaScript超集
Vite	5.x	下一代前端构建工具

2.4 AI模型

模型	提供商	用途
Qwen-VL-Plus	阿里云	视觉语言大模型，用于图像理解和违规检测

3. 环境要求

3.1 后端环境

环境	要求
Python	3.10 或更高版本
操作系统	Windows / Linux / macOS
网络	需要网络连接以调用阿里云DashScope API
内存	建议 2GB+
磁盘	建议 1GB+ 可用空间

3.2 前端环境（开发模式）

环境	要求
Node.js	16.x 或更高版本
npm	8.x 或更高版本

3.3 阿里云DashScope API

需要有效的阿里云账号
需要开通DashScope服务
需要获取API Key

4. 安装部署

4.1 后端部署

4.1.1 克隆项目

bash 复制代码

git clone https://github.com/longjie-sir/VL-Marker.git
cd VL-Marker

4.1.2 创建虚拟环境（推荐）

bash 复制代码

# Windows
python -m venv venv
venv\Scripts\activate

# Linux/macOS
python3 -m venv venv
source venv/bin/activate

4.1.3 安装依赖

bash 复制代码

pip install -r requirements.txt

4.1.4 配置环境变量

在项目根目录创建 .env 文件：

env 复制代码

# 阿里云DashScope API密钥
DASHSCOPE_API_KEY=your_api_key_here

重要：将 your_api_key_here 替换为您的阿里云DashScope API密钥。

4.1.5 启动服务

开发模式（支持热重载）：

bash 复制代码

python -m uvicorn main:app --reload --host 0.0.0.0 --port 8001

生产模式：

bash 复制代码

python -m uvicorn main:app --host 0.0.0.0 --port 8001

服务启动后，可以访问以下地址：

API服务：http://localhost:8001
API文档（Swagger UI）：http://localhost:8001/docs
API文档（ReDoc）：http://localhost:8001/redoc

4.2 前端部署

4.2.1 进入前端目录

bash 复制代码

cd frontend

4.2.2 安装依赖

bash 复制代码

npm install

4.2.3 配置API地址

编辑 frontend/src/services/api.ts，修改API基础URL：

typescript 复制代码

const API_BASE_URL = 'http://localhost:8001/api/v1';

生产环境：将URL改为实际的后端服务地址。

4.2.4 开发模式启动

bash 复制代码

npm run dev

4.2.5 构建生产版本

bash 复制代码

npm run build

构建完成后，静态文件将生成在 frontend/dist 目录下。

4.2.6 部署静态文件

将 frontend/dist 目录下的所有文件部署到Web服务器（如Nginx、Apache等）。

5. API接口文档

5.1 接口概览

接口路径	方法	功能描述
`/api/v1/sites/config`	POST	注册/更新站点配置
`/api/v1/sites/{site_id}`	GET	获取指定站点配置
`/api/v1/sites`	GET	获取所有站点配置
`/api/v1/analyze/frame`	POST	执行单帧图片违规检测

5.2 站点配置接口

5.2.1 注册/更新站点配置

请求：

复制代码

POST /api/v1/sites/config
Content-Type: application/json

请求体：

json 复制代码

{
  "site_id": "js01",
  "site_name": "江苏一号仓库大门",
  "rule_type": "in_bounds",
  "polygon_cfg": [
    {"x": 0.15, "y": 0.20},
    {"x": 0.85, "y": 0.20},
    {"x": 0.90, "y": 0.80},
    {"x": 0.10, "y": 0.80}
  ],
  "reference_image": "",
  "prompt": "请检查图片中是否有车驶入标记的红色区域内，并严格遵守以下json格式进行信息的返回:{\"result\":true/false,\"reason\":\"判断理由\"}"
}

参数说明：

参数	类型	必填	说明
`site_id`	string	是	站点唯一标识符
`site_name`	string	是	站点业务名称
`rule_type`	string	否	规则类型：`in_bounds`（必须在框内）/ `no_entry`（禁止入内），默认 `in_bounds`
`polygon_cfg`	array	是	多边形顶点坐标数组，至少3个点，坐标为相对值（0.0-1.0）
`reference_image`	string	否	参考图片的Base64编码
`prompt`	string	否	分析提示词，支持占位符 `{rule_type}`

响应体：

json 复制代码

{
  "code": 200,
  "message": "success",
  "data": {
    "site_id": "js01",
    "site_name": "江苏一号仓库大门",
    "rule_type": "in_bounds",
    "polygon_cfg": [
      {"x": 0.15, "y": 0.2},
      {"x": 0.85, "y": 0.2},
      {"x": 0.9, "y": 0.8},
      {"x": 0.1, "y": 0.8}
    ],
    "reference_image": "",
    "prompt": "请检查图片中是否有车驶入标记的红色区域内..."
  }
}

5.2.2 获取指定站点配置

请求：

复制代码

GET /api/v1/sites/{site_id}

响应体：

json 复制代码

{
  "code": 200,
  "message": "success",
  "data": {
    "site_id": "js01",
    "site_name": "江苏一号仓库大门",
    "rule_type": "in_bounds",
    "polygon_cfg": [...],
    "reference_image": "",
    "prompt": "..."
  }
}

5.2.3 获取所有站点配置

请求：

复制代码

GET /api/v1/sites

响应体：

json 复制代码

{
  "code": 200,
  "message": "success",
  "data": {
    "sites": [
      {
        "site_id": "js01",
        "site_name": "江苏一号仓库大门",
        "rule_type": "in_bounds",
        "polygon_cfg": [...],
        "reference_image": "",
        "prompt": "...",
        "created_at": "2024-01-01 12:00:00"
      }
    ]
  }
}

5.3 违规检测接口

5.3.1 执行单帧图片违规检测

请求：

复制代码

POST /api/v1/analyze/frame
Content-Type: application/json

请求体：

json 复制代码

{
  "site_id": "js01",
  "image_base64": "/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAY..."
}

参数说明：

参数	类型	必填	说明
`site_id`	string	是	站点唯一标识符
`image_base64`	string	是	Base64编码的图片

响应体：

json 复制代码

{
  "code": 200,
  "message": "success",
  "data": {
    "site_id": "js01",
    "has_violation": true,
    "violation_desc": "检测到一辆白色货车车轮已超出红色合法区域边界。",
    "model_latency_ms": 2350
  }
}

响应字段说明：

字段	类型	说明
`site_id`	string	站点唯一标识符
`has_violation`	boolean	是否存在违规行为
`violation_desc`	string	违规描述信息
`model_latency_ms`	number	模型调用耗时（毫秒）

6. 配置说明

6.1 环境变量配置

在项目根目录的 .env 文件中配置：

env 复制代码

# 阿里云DashScope API密钥（必填）
DASHSCOPE_API_KEY=sk-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

6.2 前端API地址配置

编辑 frontend/src/services/api.ts：

typescript 复制代码

// 开发环境
const API_BASE_URL = 'http://localhost:8001/api/v1';

// 生产环境
const API_BASE_URL = 'https://your-domain.com/api/v1';

6.3 服务端口配置

编辑 main.py 修改默认端口：

python 复制代码

if __name__ == "__main__":
    import uvicorn
    uvicorn.run(app, host="0.0.0.0", port=8001)  # 修改端口号

6.4 CORS配置

编辑 main.py 修改CORS设置：

python 复制代码

app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],  # 生产环境建议设置具体的前端域名
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

附录

A. 依赖版本

复制代码

fastapi
uvicorn[standard]
sqlmodel
opencv-python
pillow
requests
python-dotenv
dashscope

视觉识别算法demo

AI 视觉监控

1. 概述

1.2 核心功能

2. 技术架构

2.1 系统架构图

2.2 后端技术栈

2.3 前端技术栈

2.4 AI模型

3. 环境要求

3.1 后端环境

3.2 前端环境（开发模式）

3.3 阿里云DashScope API

4. 安装部署

4.1 后端部署

4.1.1 克隆项目

4.1.2 创建虚拟环境（推荐）

4.1.3 安装依赖

4.1.4 配置环境变量

4.1.5 启动服务

4.2 前端部署

4.2.1 进入前端目录

4.2.2 安装依赖

4.2.3 配置API地址

4.2.4 开发模式启动

4.2.5 构建生产版本

4.2.6 部署静态文件

5. API接口文档

5.1 接口概览

5.2 站点配置接口

5.2.1 注册/更新站点配置

5.2.2 获取指定站点配置

5.2.3 获取所有站点配置

5.3 违规检测接口

5.3.1 执行单帧图片违规检测

6. 配置说明

6.1 环境变量配置

6.2 前端API地址配置

6.3 服务端口配置

6.4 CORS配置

附录

A. 依赖版本

B. 参考链接