rtsp转h5播放

  1. 服务器安装ffmpeg到e:\ffmpeg,设置PATH

  2. 安装node.js

  3. 下载websocket-relay.js到e:\zhibo 下载地址

  4. e:\zhibo\npm install ws,注意不要用-g参数安装全局

  5. e:\zhibo\node websocket.js supersecret 8081 8812
    8081会交给ffmpeg传输数据,8812用来提供http流服务

  6. 把串流进行转换,可以转换多个,每个cmd窗口打开一个:
    ffmpeg -i “rtsp://admin:a1234567@10.0.71.94:554/h264/ch1/sub/av_stream” -q 0 -f mpegts -codec:v mpeg1video -s 704x578 http://127.0.0.1:8081/supersecret/camra_1

ffmpeg -i “rtsp://admin:a1234567@10.0.71.95:554/h264/ch1/sub/av_stream” -q 0 -f mpegts -codec:v mpeg1video -s 704x578 http://127.0.0.1:8081/supersecret/camra_2
用的是sub子码流,主码流把sub换成main

  1. jsmpeg.min.js放到web服务器上,h5嵌入代码:
<canvas id="video-canvas1"></canvas>	
<canvas id="video-canvas2"></canvas>	
	<script type="text/javascript" src="jsmpeg.min.js"></script>
	<script type="text/javascript">
		var canvas1 = document.getElementById('video-canvas1');
		var url1 = 'ws://'+document.location.hostname+':8812/live1';
		var player1 = new JSMpeg.Player(url1, {canvas: canvas1});
		
		var canvas2 = document.getElementById('video-canvas2');
		var url2= 'ws://'+document.location.hostname+':8812/live2';
		var player2 = new JSMpeg.Player(url2, {canvas: canvas2});		
	</script>

访问即可。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值