场景
需要在web端预览海康无线摄像头视频流,所以采用海康自身提供的web sdk无法使用
方案1
rtsp流推送到应用服务器,应用服务器再通过ffmpeg 推送到nginx, js再去拉流
缺点: 多了一层转发,造成了一定的延迟
方案2
通过webRTC方案,使用现有开源插件 webrtc-streamer
https://github.com/mpromonet/webrtc-streamer
实施
- 采用docker安装
docker run --net=host -itd --name webrtc-streamer mpromonet/webrtc-streamer:v0.6.5 -- 注意 0.6.5 之后的版本会导致api/getIceServers 无法访问,问题还没找到
- 代码示例
- 去github上下载前端包 https://github.com/mpromonet/webrtc-streamer/releases
- 解压后,将html文件夹拷贝到项目里面
- 具体代码
<html> <head> <script src="html/libs/adapter.min.js" ></script> <script src="html/webrtcstreamer.js" ></script> <script> var webRtcServer = null; window.onload = function() { webRtcServer = new WebRtcStreamer("video", "http://192.168.31.160:8000"); webRtcServer.connect("rtsp://192.168.31.199:554/openUrl/Tsca7jq"); } window.onbeforeunload = function() { webRtcServer.disconnect(); } </script> </head> <body> <video id="video"></video> </body> </html>
- 注意
视频流一定要设置成h264格式的,可以在海康摄像头管理界面去设置
- 效果