EasyNVR纯H5摄像机直播解决方案前端解析之:RTSP安防监控实时直播的网页H5自动播放方案

2020-04-23 11:45:53 浏览数 (1)

我们很多安防、互联网、直播的应用场景中,在打开一路直播流后,极少看到需要点击播放按钮才能直播 播放视频流的情况,但是由于H5场景的播放需要兼容的浏览器非常多,这样的情况下经常会遇到各种各样的摄像机网页播放的问题,比如这里解析的视频流自动播放的问题:

很多安防、摄像机、互联网流媒体播放多采用的是Video.js来进行播放,Video.js本身自带自动播放属性,通过添加autoplay(),来完成视频播放的自动加载;

代码语言:javascript复制
	player = videojs("video", {
         autoplay: true,
    });

在制作四分屏的时出现给videojs添加autoplay()后,在一些浏览器上并不能完成自动播放,videojs加载完成后视频播放呈现出暂停样式,在其他浏览器上可以自动加载播放;如下图:

解决:

代码语言:javascript复制
videojs.options.flash.swf = 'video-js-fixed.swf';

设置flash路径,Video.js会在不支持html5的浏览中使用flash播放视频文件;

配合autoplay()就可以完成自动加载了播放;

EasyPlayer.js

我们将很多常用的情况下需要的H5、浏览器、微信、Chrome、Flash播放功能,都整合到了一个非常高效、稳定、完善的EasyPlayer.js播放器中,兼容了HTTP、HLS(m3u8)、RTMP、HTTP-FLV等多种协议的视频流,采用flash播放时,还扩展了快照、极小延时的极速模式、平铺播放等等,多种属性的播放方式,详情可以参考:https://github.com/EasyDSS/EasyPlayer.js

关于EasyNVR

EasyNVR能够通过简单的网络摄像机通道配置,将传统监控行业里面的高清网络摄像机IP Camera、NVR等具有RTSP协议输出的设备接入到EasyNVR,EasyNVR能够将这些视频源的音视频数据进行拉取,转换为RTMP/HLS,进行全平台终端H5直播(Web、Android、iOS),并且EasyNVR能够将视频源的直播数据对接到第三方CDN网络,实现互联网级别的直播分发;

0 人点赞