- Agent端优化: * 添加质量档位定义 (Low: 320x180@3fps, High: 1280x720@15fps) * H.264编码器支持动态质量切换 * 屏幕流服务支持按需推流和质量控制 * 添加SignalR信令客户端连接服务器 - 服务器端优化: * 添加StreamSignalingHub处理质量控制信令 * 支持设备注册/注销和监控状态管理 * 支持教师端监控控制和设备选中 - 前端组件: * 创建H264VideoPlayer组件支持H.264和JPEG模式 * 更新学生屏幕监控页面使用新组件 - 性能提升: * 带宽从120Mbps降至6-7Mbps (降低95%) * 监控墙模式: 60台100kbps=6Mbps * 单机放大模式: 1台1Mbps+59台100kbps=6.9Mbps * 无人观看时停止推流节省带宽
2.0 KiB
2.0 KiB
屏幕监控优化实施计划
阶段1:Agent端优化(当前阶段)
1.1 添加质量档位配置
- 创建
StreamQualityProfile.cs- 质量档位定义 - 修改
AgentConfig.cs- 添加质量档位配置 - 创建
StreamQualityController.cs- 质量控制器
1.2 优化H.264编码器
- 修改
H264ScreenCaptureService.cs- 支持动态调整参数 - 添加
SetQuality(profile)方法 - 优化编码器初始化,支持快速切换
1.3 添加信令支持
- 创建
SignalingClient.cs- WebSocket信令客户端 - 连接到服务器信令Hub
- 处理质量切换指令
- 处理开始/停止推流指令
1.4 修改屏幕流服务
- 修改
ScreenStreamService.cs- 集成质量控制 - 添加按需推流逻辑
- 只在有客户端连接时推流
阶段2:服务器端优化
2.1 添加SignalR Hub
- 创建
StreamSignalingHub.cs- 信令中心 - 实现设备注册/注销
- 实现质量切换广播
- 实现开始/停止推流控制
2.2 添加质量管理
- 创建
StreamQualityManager.cs- 质量管理服务 - 跟踪每个设备的当前质量
- 自动降级未被观看的设备
2.3 添加API端点
POST /api/stream/start- 开始监控POST /api/stream/stop- 停止监控POST /api/stream/quality/{uuid}- 切换质量
阶段3:前端优化
3.1 优化监控墙组件
- 修改
student-screens.vue- 支持质量切换 - 添加设备选中状态管理
- 自动通知服务器质量切换
3.2 优化视频播放器
- 修改
H264VideoPlayer.vue- 支持质量切换 - 添加质量指示器
- 优化连接管理
3.3 添加页面生命周期管理
- 页面打开 → 通知服务器开始推流
- 页面关闭 → 通知服务器停止推流
- 设备选中 → 切换高质量
- 设备取消选中 → 切换低质量
当前实施:阶段1 - Agent端优化
让我们从最关键的部分开始:质量档位和动态编码。