原創(chuàng)作者：溫嶺王駿
環(huán)境：
測(cè)試攝像機(jī)：航翟剩康威視 DS-2CD7T4EP-LS
顯卡：NVIDIA 1050
流媒體服務(wù)器：websocket-relay
拉流推流：ffmpeg
H5播放器：jsmpeg
上文憾魑牛康安防攝像機(jī)推流到H5頁(yè)面（node-media-server+ffmpeg+flv.js），采用的方案是node-media-server+ffmpeg+flv.js剧董，本文中采用的方案是：websocket-relay+ffmpeg+jsmpeg.js
1幢尚、nodejs的安裝及攝像機(jī)的配置，沒(méi)有特別之處送滞，請(qǐng)搜索網(wǎng)絡(luò)及參考上文侠草。
2、下載jsmpeg犁嗅，里面包含了jsmpeg.min.js和websocket-relay.js
3、運(yùn)行websocket-relay.js
node websocket-relay.js supersecret 8081 8082
8081是接收視頻流的端口晤碘，8082是輸出視頻流的端口
4褂微、ffmpeg推流到websocket-relay
假設(shè)攝像機(jī)用戶名：admin功蜓，密碼：hik12345
推流命令：
ffmpeg -rtsp_transport tcp -i rtsp://admin:hik12345@192.168.1.18:554/h264/ch1/sub/av_stream -c copy -q 0 -map 0:0 -f mpegts -codec:v mpeg1video http://127.0.0.1:8081/supersecret
不能加-hwaccel cuvid -c:v h264_cuvid參數(shù)，會(huì)有沖突宠蚂。實(shí)際延時(shí)小于1秒式撼，貌似已經(jīng)自動(dòng)使用了GPU編解碼。
5求厕、H5頁(yè)面
<html>
<body>
<canvas id="video-canvas"></canvas>
<script type="text/javascript" src="jsmpeg.min.js"></script>
<script type="text/javascript">
var canvas = document.getElementById('video-canvas');
var url = 'ws://127.0.0.1:8082';
var player = new JSMpeg.Player(url, {canvas: canvas, loop: true, autoplay: true});
</script>
</body>
</html>
