简述
RTSPtoWebRTC和RTSPtoWeb是go语言编写的一套将rtsp视频流在网页上用js直接播放的程序。两套虽然都能转rtsp,通过js在html上进行播放,但是都是自己内部的一个tmpl模板,如果想自己弄的话,还需要自己实现一个js用于自己的html上播放。
环境准备
go语言环境安装:参考其他博主的文章。
https://juejin.cn/post/6982916943183347742
https://blog.csdn.net/weixin_43866211/article/details/108877256
rtsp流准备:摄像头流地址或者自己推rtsp流的地址准备。摄像头取流地址网上都有,设置好相关的参数就可以获取了。
vlc准备:有rtsp流之后,可以通过vlc来校验一下是否能播放流。
我的目的就是要将视频最终展现在自己系统中,所以下面涉及了自己改动的一些代码。自己是学java的,第一次用go语言,边百度边修改了一些。有更改的改进可以学习学习。
RTSPtoWebRTC:
- 下载
https://github.com/deepch/RTSPtoWebRTC
- 编译
在当前目录下,打开cmd命令窗口,输入一下命令,就会拉去对应的依赖,拉取好之后,再执行一遍该命令,就会得到一个RTSPtoWebRTC.exe的应用程序。
go build
- 配置config.json
{
"server": {
"http_port": ":8083",
"ice_servers": ["stun:stun.l.google.com:19302"]
},
"streams": {
"dahua107": {
"on_demand": true,
"disable_audio": false,
"url": "rtsp://admin:whxx@192.168.1.107:554/cam/realmonitor?channel=1&subtype=0"
},
"dahua108": {
"on_demand": true,
"disable_audio": false,
"url": "rtsp://admin:whxx@192.168.1.108:554/cam/realmonitor?channel=1&subtype=0"
}
}
}
8083是启动端口,ice-servers是一个国外的服务器,好像是做内网穿透什么的,网上有很多类似服务器,如果这个提示访问不了,就换一个网上能用的,也可以自己搭建一个这种服务器。如果不通,第一下检查一下host文件,将真实ip做个映射试试看。
下面是摄像头的流,我这里配置了两个。on_demand(配置flase就会启动即监控,多了会卡,资源占用多),disable_audio(是否启用音频)。
- 配置好后,双击exe启动项目,连上了摄像头的话,会有响应提示。访问localhost:8083,就可以看到配置的摄像头的视频信息了。
改进
这个能看只是在他们页面上看,而且启动的时候不管配置文件中配置的on_demand是否是true,最后都会加载摄像头,消耗着资源。我的项目想法是点一个看一个,启动时候都不加载,看哪个点哪个。改进点如下
改进步骤1:
我用go写了一个http接口,用于前端去控制,调用该接口就生成视频资源进行播放。
修改http.go
- 新增了一个openCamera接口,在路径参数中获取uuid,uuid就是config.json里面的流的名称。启动一个就会开启响应的编码工作。
改进步骤2:
- 注释掉HTTPAPIServerStreamCodec中的
Config.RunIFNotRun(c.Param(“uuid”))
- 因为项目启动时候,会调用这个方法,如果摄像头没启动,都会启动。项目启动时候我没找到哪里调用了这个方法,对go不熟没有找到启动地方,所以这里注释掉。
做完这些后,重新执行go build命令,生成一个新的exe文件。双击启动,这个时候访问localhost:8083就发现没有摄像头看了。是因为启动关闭了,这个时候我们需要触发一下我们写的接口。例如用postman调用:
http://127.0.0.1:8083/stream/openCamera/dahua108
就可以开启摄像头,在播放的页面中就可以播放了。整合到自己系统是想着做一个嵌套页面,把播放的页面直接嵌套到项目中,然后由前端再调整一下。还有一点就是,RTSPtoWebRTC会自动关闭没有播放的流,控制台会提示no viewer,没有观看的行为,就会关闭流,我对cpu内存也留意了一下,确实会释放资源。
准备实现这套方案的时候,突然看到两个帖子:
https://www.jianshu.com/p/9bb7fd966710
https://blog.csdn.net/u011039332/article/details/126733310?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522167351405616800217030261%2522%252C%2522scm%2522%253A%252220140713.130102334…%2522%257D&request_id=167351405616800217030261&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2allsobaiduend~default-2-126733310-null-null.142v70one_line,201v4add_ask&utm_term=RTSPtoWeb&spm=1018.2226.3001.4187
分别是博主自己实现了一个js来播放webrtc,和使用RTSPtoWeb。
RTSPtoWeb
RTSPtoWeb是RTSPtoWebRTC的升级版,提供了web端,以及hls,hlsll,mse,webrtc四种方法来播放,还提供了一系列的API doc,尤其是对webrtc接口信息的获取,第一个博主就是使用js来获取该接口信息,完成视频流的播放的,我也是借鉴了第一个博主的js,稍微改动了一下,达到了自己想要的目的。
- 拉取项目,第一个是含有关键js的,第二个是RTSPtoWeb的项目。
https://github.com/Bian-Sh/RTSP-Player-For-Unity-WebGL
https://github.com/deepch/RTSPtoWebRTC
- 新建一个文件夹,mywebrtc,下面要把两个里面有用的东西提到这个项目文件夹下。
- 提取RTSP-Player-For-Unity-WebGL\RTSPPlayer下的所有文件,有几个文件没用,也一并拖到player目录下。提取RTSPtoWeb整个文件夹出来。最后mywebrtc下有两个文件夹,一个是player,一个是RTSPtoWeb。
- 修改信息
修改config.json
{
"server": {
"debug": true,
"http_debug": false,
"http_demo": true,
"http_dir": "web",
"http_login": "demo",
"http_password": "demo",
"http_port": ":8083",
"https": false,
"https_auto_tls": false,
"https_auto_tls_name": "",
"https_cert": "server.crt",
"https_key": "server.key",
"https_port": ":443",
"ice_servers": ["stun:stun.l.google.com:193022"],
"log_level": "debug",
"rtsp_port": ":5541",
"token": {
"backend": "http://127.0.0.1/test.php"
},
"defaults": {
"audio": true
}
},
"streams": {
"dahua108": {
"channels": {
"0": {
"url": "rtsp://admin:whjst2012.@192.168.1.108:554/cam/realmonitor?channel=1&subtype=0",
"debug": false,
"on_demand": true,
"audio": true
}
},
"name": "dahua"
},
"dahua107": {
"channels": {
"0": {
"url": "rtsp://admin:whjst2012.@192.168.1.107:554/cam/realmonitor?channel=1&subtype=0",
"debug": false,
"on_demand": true,
"audio": true
}
},
"name": "dahua"
}
}
}
on_demand设置为true则项目启动时候不会主动加载,播放的时候才加载。主要逻辑在storageStreamChannle.go中的StreamChannelRunAll方法,如果为false,则会去加载调用。
修改player/index.html。
整个dahua107是在config.json中的流的名称。还加了一个关闭页面就销毁进程的,避免浪费资源。
修改webrtcplayer.js
第一张图片修改的是新加了一个http头,否则就要像原博主一样,启动他的一个exe,开启80端口。加了这个头子,可以直接双击html,打开播放。第二张图片是把音频加了进去,原博主没有加,就不会出现声音,我也是调了很久,跟RTSPtoWeb里面的播放的js一步步的对才发现这个的,加上了就有声音了。但是这个webrtc支持的声音类型要是PCM_ALAW PCM_MULAM,摄像头的配置里面都可以设置,PCM_ALAW PCM_MULAM,可能又叫做G.711开头的。
- 启动RTSPtoWeb.exe,双击打开index.html,这个时候就能观看视频了,其余的还是交给前端人员去仔细调整,具体的优化逻辑后面再慢慢做,起码能在自己的html中播放了。
我的文件链接:
链接:https://pan.baidu.com/s/1lQ0XJRh2om-6Q8SeH0qZAA
提取码:k6ld