# 大规模屏幕监控优化设计 ## 1. 整体架构 ``` ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │ 学生端 │ │ 服务器 │ │ 教师端 │ │ (Agent) │◄───────►│ (信令) │◄───────►│ (Web) │ │ │ │ │ │ │ │ DXGI采集 │ │ WebSocket │ │ 监控墙 │ │ H.264编码 │ │ 信令转发 │ │ 视频解码 │ │ WebSocket │ │ 质量控制 │ │ 动态切换 │ └─────────────┘ └─────────────┘ └─────────────┘ │ │ └───────────────────────────────────────────────┘ 直连 WebSocket (视频流) ``` ## 2. 质量档位设计 ### 低质量模式(监控墙) - 分辨率:320x180 - 帧率:3 fps - 码率:100 kbps - 用途:60台总览 ### 高质量模式(单机放大) - 分辨率:1280x720 - 帧率:15 fps - 码率:1000 kbps - 用途:单台详细查看 ## 3. 核心流程 ### 学生端流程 ``` 1. Agent启动 → 初始化DXGI采集器 2. 等待服务器信令 → 收到"开始推流"指令 3. 根据质量参数 → 配置编码器 4. 开始采集编码 → 通过WebSocket推送 5. 收到"停止推流" → 立即停止 6. 收到"切换质量" → 动态调整编码参数 ``` ### 教师端流程 ``` 1. 打开监控墙 → 向服务器请求所有设备列表 2. 服务器通知所有Agent → 开始低质量推流 3. 教师点击某设备 → 通知该设备切换高质量 4. 其他设备保持低质量 → 节省带宽 5. 教师关闭监控墙 → 通知所有Agent停止推流 ``` ## 4. 带宽控制策略 ### 策略1:按需推流 - 只有教师打开监控墙时,学生端才推流 - 教师离开页面,所有推流立即停止 ### 策略2:质量分级 - 默认所有设备低质量(100kbps) - 被选中设备切换高质量(1Mbps) - 取消选中立即降回低质量 ### 策略3:动态调整 - 检测网络拥塞 → 自动降低码率 - 网络恢复 → 恢复正常码率 ## 5. 关键技术点 ### DXGI Desktop Duplication - 优势:只捕获变化区域,CPU占用低 - 支持硬件加速 - Windows 8+ 原生支持 ### Media Foundation H.264编码 - 优势:支持硬件编码(QuickSync/NVENC) - 动态调整码率和分辨率 - 低延迟 ### WebSocket直连 - 学生端直接推送到教师端浏览器 - 服务器只转发信令,不处理视频数据 - 降低服务器压力 ## 6. 性能保证 ### 60台设备流畅运行的原因 1. **低质量模式带宽可控** - 60台 × 100kbps = 6Mbps - 远低于千兆网络容量 2. **硬件编码降低CPU占用** - 使用GPU编码,CPU占用<5% - 每台学生机可轻松支持 3. **差分捕获减少数据量** - DXGI只捕获变化区域 - 静止画面几乎不占带宽 4. **按需推流避免浪费** - 无人观看时不推流 - 节省网络和CPU资源 5. **服务器仅转发信令** - 不解码视频 - 可支持数百台设备 ## 7. 实现模块 ### Agent端模块 - `DxgiScreenCaptureService.cs` - DXGI屏幕采集 - `AdaptiveH264EncoderService.cs` - 自适应H.264编码 - `StreamQualityController.cs` - 质量控制 - `SignalingClient.cs` - 信令客户端 ### 服务器端模块 - `StreamSignalingHub.cs` - SignalR信令中心 - `StreamQualityManager.cs` - 质量管理 - `DeviceStreamController.cs` - 设备流控制 ### 教师端模块 - `MonitorWall.vue` - 监控墙组件 - `AdaptiveVideoPlayer.vue` - 自适应视频播放器 - `StreamQualitySelector.vue` - 质量选择器