播放rtsp流
1. 概述
zwplayer 是一款专为HTML5网页设计的视频播放器，能够实现RTSP协议视频流在现代浏览器中的无缝播放。该方案主要解决网络摄像机RTSP视频流在H5浏览器中的实时播放需求。
2. 技术背景
现代浏览器（如Chrome、Edge、firefox等）存在以下限制：
不支持ActiveX控件
无法通过JS进行TCP协议的Socket编程
因此当前的现代浏览器无法原生播放RTSP协议流。
3. 解决方案架构
本方案通过将H5播放器请求的RTSP流转交给媒体网关服务器（协处理流媒体服务器），由媒体网关服务器端拉取摄像机的RTSP流进行协议转换(包含必要时转码)，将RTSP流转化为现代浏览器能够支持的WEBRTC、HTTP-FLV、HLS、DASH流，并利用ZWPlayer调用MSE接口实现在H5网页中无插件播放RTSP视频流。
3.1 流程图
3.2 流程说明
起点：用户请求发起
H5网页用户请求播放 → zwplayer初始化配置
用户在网页中触发播放请求
zwplayer根据配置参数初始化直接将rtsp流地址传给
zwplayer
第一阶段：服务器端处理
请求转发：
zwplayer将 RTSP 流地址发送至媒体网关携带参数：
xmc_url、rtsp_over_tcp、rtsp_bypass等流获取：媒体网关拉取原始 RTSP 流
协议转换：媒体网关进行实时转协议处理：
RTSP → WEBRTC/HTTP-FLV/HLS/DASH
根据设置的
rtsp_bypass参数，决定是否需要转码
第二阶段：客户端播放
流接收：浏览器接收转换后的流媒体数据
MSE解码：
zwplayer调用浏览器 MSE 接口进行解码视频渲染：
zwplayer播放视频
3.3 配置参数
要在H5浏览器中直接播放rtsp协议流，需要在zwplayer播放器构造时传入如下参数：
| 参数名称 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
xmc_url | String | - | 是 | 媒体网关地址。媒体网关拉取摄像头的rtsp流并转换成html5播放器能接受的协议（如http-flv，webrtc等)。示例如下：ws://xmc.zwplayer.cn:8138 或 http://xmc.zwplayer.cn:8138 。 zwplayer与媒体网关采用websocket协议交互。 |
rtsp_over_tcp | Boolean | true | 否 | RTSP传输协议选择（true=TCP，false=UDP）,采用udp传输的rtsp不能跨网段。因此如果需要跨网段，如转发公网上的摄像头视频，建议采用基于tcp的rtsp协议。 |
rtsp_bypass | Boolean | false | 否 | 是否进行音视频重新编码 |
has_audio | Boolean | false | 否 | 是否保留音频流 |
网络传输建议
局域网环境：可尝试rtsp_over_tcp: false（UDP传输，延迟更低）
跨网段/公网：建议rtsp_over_tcp: true（TCP传输，稳定性更好）
性能优化选项
rtsp_bypass: true：不重新编码，延迟更低（要求浏览器支持原始编码格式）
rtsp_bypass: false：强制转码，兼容性更好
4. 完整示例
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" charset="utf-8" src="https://cdn.zwplayer.cn/v3/zwplayer/zwplayer.js"></script>
</head>
<body>
<div id="mse" style="width: 800px; height: 450px;"></div>
<script type="text/javascript">
// 播放器配置
var streamInfo = {
playerElm: '#mse', // 播放器容器元素
url: 'rtsp://admin:ab123456@192.168.1.64:554/main', // RTSP流地址
xmc_url: 'http://xmc.zwplayer.cn:8138', // 媒体网关地址，根据实际情况修改
rtsp_over_tcp: true, // 使用TCP传输
rtsp_bypass: true, // 启用编码绕过
has_audio: false, // 禁用音频
};
var player1 = new ZWPlayer(streamInfo);
</script>
</body>
</html>
5. 毫秒级低延时演示
如果采用webrtc输出，不转码，则整个延时小于300毫秒，比摄像头自身的预览延时还低：
低延时实测对比：