视频流分屏显示方法、装置、系统、拉流设备和存储介质制造方法及图纸

技术编号:36686723 阅读:23 留言:0更新日期:2023-02-27 19:50
本发明专利技术实施例公开了一种视频流分屏显示方法、装置、系统、拉流设备和存储介质,拉流设备通过使用本地浏览器中的WebRTC协议获取流媒体服务器上由推流客户端推流过来的视频流,并将其转换为WebRTC视频流,然后再利用HTML5中的多个VIDEO标签对WebRTC视频流进行分屏实时播放。本发明专利技术的技术方案基于WebRTC协议的超低延时特性,将其与传统的推拉流媒体系统相结合,在需要流媒体服务器中转推流视频流的场景下实现了低至35~70ms延时内的多屏播放视频流的技术目的。由此,降低了延时,进而提升了实时多屏播放视频时的用户体验。时多屏播放视频时的用户体验。时多屏播放视频时的用户体验。

【技术实现步骤摘要】
视频流分屏显示方法、装置、系统、拉流设备和存储介质


[0001]本专利技术涉及流媒体和网络传输
,尤指一种视频流分屏显示方法、装置、系统、拉流设备和存储介质。

技术介绍

[0002]近年来,随着科技的进步,在历经了文件(File)、页面(Web)时代后,现在迎来了以“流(Flows/Streams)”为单位的时代,大众的生活节奏也在各种信息流、数据流、媒体流中变得越来越快。
[0003]向“流”转变最初最典型的应用就是流媒体(Streaming Midea)技术,它指的是在网络上采用流式传输技术来发布音频、视频以及其他多媒体文件。所谓的流式传输就是将音频、视频多媒体文件经过一定算法编码压缩成一个个很小的压缩包,流媒体服务器通过特定网络协议进行连续、实时的传送,用户端接收到压缩包后由播放软件实时解压缩实现播放的过程。
[0004]目前在流媒体
有很多应用场景,包括:视频互动、远程教育和医疗、直播带货、监控等。在一些场景下,例如:监控,需要通过网页端多屏显示多个摄像头所监控的画面,现有技术实现该功能的技术方案中,当推流端设备(如:监控摄像头,移动设备等)将采集的视频数据推流到流媒体服务器后,其中一种处理方式是需要流媒体服务器将视频流转化为可以在网页浏览器中直接播放的HLS(HTTP Live Streaming,即:基于HTTP的自适应码率流媒体传输协议)、MSE(Media Source Extensions,即:媒体源扩展)或FLV(Flash Video)等协议格式的视频流,网页端再对转化后的视频流进行拉流并播放,此方案所存在的问题如下:
[0005]1、对于HLS协议来说,它是由苹果公司提出的流媒体网络传输协议,主要用于PC和Apple终端的音视频服务。HLS由于使用的HTTP协议传输数据,所以一般不会遇到被防火墙屏蔽的情况,另外,HLS协议本身实现了码率自适应,不同带宽的设备可以自动切换到最适合自己码率的视频播放。但是,HLS是以视频切片的形式分段播放的,包括一个M3U8的索引文件,TS媒体分片文件和key加密串文件。由于其分片加载的特性,播放视频的延迟相对较长,比如一个M3U8有5个TS文件,每个TS文件播放时长是2秒,那么一个M3U8文件的播放时长就是10秒,也就是说这个M3U8播放的进度至少是10秒之前的,虽然苹果公司在WWDC 2019发布了新的解决方案,可以将延迟降低到1至2秒,但这对于对于实时性要求比较高的场景来说仍是一个比较大的弊端。
[0006]2、对于MSE来说,MSE是一个主流浏览器支持的新的Web API,提供了实现无插件且基于Web的流媒体的功能,通过使用MSE,用户可以动态地修改媒体流而不需要任何的插件。但是,如果在部分浏览器不支持MSE的情况下,那么在这些浏览器中创造能兼容MSE是非常费时费力的,并且还要消耗大量计算机资源和能源。另外,在播放视频时延时在3秒左右,延时稍大。
[0007]3、对于FLV协议来说,FLV是一种流媒体格式,因其体积小、协议相对简单而得到广
泛的支持,具有成熟度高、高并发无压力的优点,但是缺点是需要集成SDK才能播放,并且,主要受GOP大小和TCP弱网传输积压影响,播放延迟也较高,一般在2秒至3秒之间。
[0008]由此可知,虽然这些协议方式都有各自的优势,但无可避免地都存在视频播放延迟较高的问题,而延迟高则会带来因视频画面更新不及时而引发的一系列问题,会直接降低用户体验。
[0009]基于如上现有技术中在网页端直播视频时的问题,目前亟待提出一种可以降低延时的视频流分屏显示方法,以提升实时多屏播放视频时的用户体验。

技术实现思路

[0010]有鉴于此,本专利技术实施例提供一种视频流分屏显示方法、装置、设备及系统和存储介质,拉流设备通过使用本地浏览器中的WebRTC协议获取流媒体服务器上由推流客户端推流过来的视频流,并将其转换为WebRTC视频流,然后再利用HTML5中的多个VIDEO标签对WebRTC视频流进行分屏实时播放。本专利技术的技术方案基于WebRTC协议的超低延时特性,将其与传统的推拉流媒体系统相结合,在需要流媒体服务器中转推流视频流的场景下实现了低至35~70ms延时内的多屏播放视频流的技术目的。由此,降低了延时,进而提升了实时多屏播放视频时的用户体验。
[0011]第一方面,本专利技术实施例提供了一种视频流分屏显示方法,应用于拉流设备,所述拉流设备安装有支持网页实时通信WebRTC协议的浏览器,所述方法包括:
[0012]预先在本地进行拉流配置,生成流列表;其中,所述流列表包含一个或多个流列表项,每个流列表项中包含其所对应的视频流在流媒体服务器中的拉流地址;
[0013]响应于对于所述流列表中的流列表项所对应的视频流进行播放的触发指令,获取所述流列表项所对应的视频流在流媒体服务器中的拉流地址,并基于所述流列表项所对应的视频流在流媒体服务器中的拉流地址从流媒体服务器拉取所述视频流,其中,所述视频流为推流客户端发送至所述流媒体服务器的原始RTSP视频流,或者经所述流媒体服务器转码后的RTSP视频流;
[0014]对所述视频流进行解码拆包,生成符合WebRTC协议的WebRTC视频流;
[0015]在按照预设分屏格式并基于本地浏览器HTML5的Video标签而生成的分屏界面中,对所述WebRTC视频流进行分屏显示。
[0016]优选地,所述预先在本地进行拉流配置,生成流列表,具体包括:
[0017]获取用户所输入的对于各视频流的流配置数据,生成相对应的流列表项;
[0018]基于各视频流的流列表项生成所述流列表;
[0019]其中,所述流配置数据包括:视频流名称,拉流地址。
[0020]优选地,其中,所述流配置数据还包括:流播放类型;所述流播放类型包括:持续播放,点击播放。
[0021]优选地,所述基于所述流列表项所对应的视频流在流媒体服务器中的拉流地址从流媒体服务器拉取所述视频流,具体包括:
[0022]基于本地浏览器中的WebRTC协议接口与所述流媒体服务器建立WebRTC连接通道,通过所述WebRTC连接通道拉取所述视频流。
[0023]优选地,所述在按照预设分屏格式并基于本地浏览器HTML5的Video标签而生成的
分屏界面中,对所述WebRTC视频流进行分屏显示,具体包括:
[0024]基于本地浏览器HTML5的Video标签,按照预设分屏格式将所述分屏界面分割成多个独立的显示窗口,每个显示窗口对应一个Video,用于播放一个WebRTC视频流。
[0025]优选地,其中,每个显示窗口包含响应添加并播放视频流的区域,用于接收用户在显示窗口中添加并播放所述流列表中的流列表项所对应的视频流的触发指令。
[0026]第二方面,本专利技术实施例还提供了一种视频流分屏显示装置,设置于拉流设备,所述拉流设备安装有支持网页实时通信WebRTC协议的浏览器,所述装置包括:
[本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种视频流分屏显示方法,应用于拉流设备,所述拉流设备安装有支持网页实时通信WebRTC协议的浏览器,其特征在于,所述方法包括:预先在本地进行拉流配置,生成流列表;其中,所述流列表包含一个或多个流列表项,每个流列表项中包含其所对应的视频流在流媒体服务器中的拉流地址;响应于对于所述流列表中的流列表项所对应的视频流进行播放的触发指令,获取所述流列表项所对应的视频流在流媒体服务器中的拉流地址,并基于所述流列表项所对应的视频流在流媒体服务器中的拉流地址从流媒体服务器拉取所述视频流,其中,所述视频流为推流客户端发送至所述流媒体服务器的原始RTSP视频流,或者经所述流媒体服务器转码后的RTSP视频流;对所述视频流进行解码拆包,生成符合WebRTC协议的WebRTC视频流;在按照预设分屏格式并基于本地浏览器HTML5的Video标签而生成的分屏界面中,对所述WebRTC视频流进行分屏显示。2.根据权利要求1所述的方法,其特征在于,所述预先在本地进行拉流配置,生成流列表,具体包括:获取用户所输入的对于各视频流的流配置数据,生成相对应的流列表项;基于各视频流的流列表项生成所述流列表;其中,所述流配置数据包括:视频流名称,拉流地址。3.根据权利要求2所述的方法,其特征在于,其中,所述流配置数据还包括:流播放类型;所述流播放类型包括:持续播放,点击播放。4.根据权利要求1所述的方法,其特征在于,所述基于所述流列表项所对应的视频流在流媒体服务器中的拉流地址从流媒体服务器拉取所述视频流,具体包括:基于本地浏览器中的WebRTC协议接口与所述流媒体服务器建立WebRTC连接通道,通过所述WebRTC连接通道拉取所述视频流。5.根据权利要求1所述的方法,其特征在于,所述在按照预设分屏格式并基于本地浏览器HTML5的Video标签而生成的分屏界面中,对所述WebRTC视频流进行分屏显示,具体...

【专利技术属性】
技术研发人员:戴福昊李勇李君君
申请(专利权)人:同辉佳视北京信息技术股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1