webrtc-streamer实现简单rtsp视频监控

环境需求:

1.linux服务器
2.nginx或其他代理服务

 

内网项目使用海康摄像机完成简单的视频监控,虽然海康提供了webcomments插件和SDK二次开发工具,但webcomments插件以及无插件版本只能适用于将项目部署在windows上,SDK二次开发也有一定难度。所以,采用以下方案来满足项目需求:

第一步:

从这里https://github.com/mpromonet/webrtc-streamer/releases下载适合项目需求的webrtc-streamer源码包,本文以webrtc-streamer-v0.7.0-Linux-x86_64-Release.tar.gz为例,下载解压后目录结构如下:

其中,webrtc-streamer文件可以删除,因为本文使用docker运行服务。另外,test.html是自己编写的页面代码,在本文第三步详细介绍。

 

第二步:

在linux服务器上运行一个WebRtcStreamer服务(这里概念上描述的可能不太准确),这个地址https://github.com/mpromonet/webrtc-streamer,翻到最下面,以docker运行为例:

 

这个是官方的命令,但是建议使用下面这个命令来运行容器,因为使用官方命令运行起来的服务,之后在预览相机画面时会出现一直转圈无法加载的问题。(具体什么原因也不是很清楚,可以查下docker网络模式host与默认bridge的区别,默认http端口为8000)

docker run -itd --net=host --name webrtc-streamer mpromonet/webrtc-streamer

命令执行完以后,用docker ps -a检查一下容器是否启动成功了

 

第三步:

编写test.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.6.73:8000");//这里填你自己部署的WebRtcStreamer服务地址
	webRtcServer.connect("rtsp://admin:123456@192.168.6.13:554/Streaming/Channels/101");//这里填可以正常预览的rtsp地址,可以先使用vlc或其他软件测试一下地址的有效性
    }
    window.onbeforeunload = function() { webRtcServer.disconnect(); }
</script>
</head>
<body> 
    <div style="width: 100%;height: 100%;">
     <video id="video" /> </div> </body> </html>

海康设备默认rtsp地址格式:rtsp://账号:密码@IP地址:554/Streaming/Channels/101  

 

第四步:

在linux服务器上安装nginx或其他代理服务器(代理服务器搭建这里不做介绍),将本文第一步中下载解压得到的文件和test.html文件一起部署到代理服务器的发布目录,并配置test.html为默认首页,如下:

 

第五步:

浏览器访问 http://服务器IP:nginx或其他代理服务器的端口/  验证效果:

 

最后:

据说这种方案比较耗费服务器的cpu资源,尤其是同时打开多个预览画面,所以,面临单页面上多开预览画面的项目请酌情参考。

 

参考链接:

这位大佬实现了windows上的服务https://blog.csdn.net/qq_45777115/article/details/118054927?spm=1001.2014.3001.5502  

https://www.cnblogs.com/savorboard/p/webrtc-rtsp.html

 

posted @ 2022-08-18 18:49  悦章  阅读(7737)  评论(2编辑  收藏  举报