💻 前端播放引擎集成 (Jessibuca)
在工业安防和数字驾驶舱中，浏览器原生对 RTSP / RTMP 等传统流媒体的支持较差，且公网 HLS 存在数秒以上的高延迟。MzMedia 在前端集成了高性能的 Jessibuca 播放器，并配套完整的降级兼容方案。
1. 在线交互演示与云台模拟控制
您可以在下方交互视窗中体验分屏切换、流协议切换以及 GB/T 28181 八向十字云台微操：
📹 Jessibuca 高性能前端播放引擎与云台交互演示交互演示
● LIVECH-01: 车间主装配线东
工业AI防爆球机 - 实时监控中
WebRTCH.265 硬解25 FPS2150 Kbps延迟: < 260ms
流传输协议选择:
WebRTC (超低延迟)WS-FLVHTTP-FLVHLS (录像)
PTZ 云台控制 (按下移动 / 释放停止):
预置位联动:
GB/T 28181 信令交互日志:
[11:00:01]Jessibuca 核心 WASM 解码引擎初始化完成 (WebAssembly SIMD 加速: ON)
[11:00:02]ZLMediaKit RTSP 转 WebRTC 会话建立，媒体协商 SDP Offer/Answer 交互成功
2. 播放协议与延迟对比
| 播放协议 | 传输层 | 典型延迟 | H.264 解码 | H.265 (HEVC) 硬解 | 适用场景 |
|---|---|---|---|---|---|
| WebRTC | UDP / DTLS | < 500ms | 原生硬件加速 | 支持（需浏览器/显卡硬解） | 实时云台操控、语音对讲、极速响应大屏 |
| WS-FLV | WebSocket / TCP | < 1000ms | WASM / Canvas | 支持 | 局域网防火墙阻断 UDP 时的次选低延时方案 |
| HTTP-FLV | HTTP Chunked | 1 ~ 2 秒 | MSE 硬件加速 | 需特定内核支持 | 局域网低配置设备、传统浏览器 |
| HLS (m3u8) | HTTP 切片 | 3 ~ 10 秒 | 原生硬件加速 | 支持 | 弱网环境、公网录像历史点播回放 |
3. 前端组件化集成示例
在 ui/src/views/media/live/index.vue 中，Jessibuca 播放组件封装了：
- 多分屏自由切换：支持 1分屏、4分屏、9分屏、16分屏自由切换与轮询；
- PTZ 云台十字控制盘：鼠标按下发送转动信令，松开自动发送停止信令；
- 全屏与抓拍：支持一键将当前关键帧截取为高清 PNG 并存盘；
- 本地即时录屏：支持在前端将实时画面录制为 WebM/MP4 格式下载。