完成运行效果图: 一.四分屏展示样式布局 1.通过html.css等来进行样式排版 根据需求的四分屏的样式:来合理的划分出四个大块,分别用于放置四个播放器: 以四等分结构为例进行前端的排版: html样式布局: <div class="row col-sm-9 video-show"> <div class="col-md-6 window1 video-window" alt="1"> </div> <…

如何在播放器上加一个云台控制界面 问题: 对于实时直播的视频播放, 由于播放页面客观样式要求(一个播放器占据了整个页面),因此很难找出很合理的空间来放置其他功能按钮的位置(比如配合实时是平的云台控制界面): EasyNVR配置中设有ONVIF探测功能:因此需要在视频播放界面添加了云台控制界面来展示出该功能: 为了保持一个良好的用户体验,在保证不影响播放效果和播放界面的前提下,如何合理的添加云台控制界面成为一个问题. 解决: 由于页面整体的样式,在页面其他位置添加云台控制界面势必会影响整体样式美观…

关于直播页面和视频列表页面切换 为了给用户更好的用户体验,并且更好的让用户快速简洁的了解实时的视频直播信息.一般多会分为列表展示和实时的视频直播展示. 表面上只是两个视图之间的随意切换,其实切换的两个视图之间存在很大的差别. EasyNVR在列表快照展示界面并没有进行视频流的播放,展示多为视频的快照信息.是否在线等信息: 而在实时四分屏展示界面不仅会展示实时的通道名称,更要通过通道名称来获取实时的视频流来进行实时的播放. 因此在进行两个视图之间的切换的时候,不仅需要考虑外表视图的变化,更应该注意…

关于videojs自动播放问题 播放流媒体多使用videojs来进行播放,videojs,本身自带自动播放属性: 通过添加autoplay(),来完成视频播放的自动加载: player = videojs("video", { autoplay: true, }); 在制作四分屏的时出现给videojs添加autoplay()后,在一些浏览器上并不能完成自动播放,videojs加载完成后视频播放呈现出暂停样式: 在其他浏览器上可以自动加载播放: 解决: videojs.options.…

初始化完成对videojs样式的调整 由于不同项目的需要,对于加载出来的videojs播放器样式也有不同的需求:我们需要自主的处理一下加载出来的videojs播放器的样式: 默认加载出来的会包含有暂停按钮.音量调节按钮.时间进度条.时间显示和全屏显示按钮等: 问题: 如果我们进行播放的视频是直播视频,时间进度条和时间显示在播放器样式上就显得有点多余:可以通过自主更改属性去除这些样式: 解决: 通过浏览器找到对应的属性名称,将对应属性的值通过CSS设置为隐藏属性: .vjs-progress-co…

video.js的基本使用方法 一.videojs的初始化加载 videojs初始化加载分为两中 1.标签式加载 在引入videojs加载文件的前提下,可以在video标签中添加属性值"data-setup='{}'",并且在class属性中添加"video-js";二者缺一不可: <video class="video-js vjs-default-skin" data-setup='{}'> "vjs-default-s…

在之前的一篇博客<web无插件播放RTSP摄像机方案,拒绝插件,拥抱H5!>中,描述了实现一套H5无插件直播方案的各个组件的参考建议,又在博客<EasyNVR H5流媒体服务器方案架构设计之视频能力平台>中对整体的架构设计思路做了总结,做高内聚.低耦合的视频能力平台,不涉足业务部分!那么今天,我们来公开一下EasyNVR到底是如何实现这些功能的: 一.程序框架 熟悉EasyDarwin的同学都知道,EasyDarwin作为老牌的功能框架,在很多领域是非常能够满足开发者需求的,尤其是…

背景分析 在之前的一篇博客<web无插件播放RTSP摄像机方案,拒绝插件,拥抱H5!>中,描述了实现一套H5无插件直播方案的各个组件的参考建议,又在博客<EasyNVR H5流媒体服务器方案架构设计之视频能力平台>中对整体的架构设计思路做了总结,做高内聚.低耦合的视频能力平台,不涉足业务部分!那么今天,我们来公开一下EasyNVR到底是如何实现这些功能的: 一.程序框架 熟悉EasyDarwin的同学都知道,EasyDarwin作为老牌的流媒体功能框架,在很多领域是完全能够满足开发…

今天遇到一个客户在使用EasyNVR无插件安防直播解决方案的时候,在Windows Server 2012上出现一个问题提示: 经过反复的查找,虽然提示上显示问题出在KERNEL32.dll上,但是已经论证,实际应该还是出在ffmpeg的调用兼容上,于是,我们在博客:http://www.cnblogs.com/nlsoft/p/5714393.html 中找到了解决方案,将ffmpeg的对应接口调用做一次新的关系映射即可: FT ft[]={ {"_wfopen_s", "…

背景需求 随着雪亮工程.明厨亮灶.手机看店.智慧幼儿园监控等行业开始将传统的安防摄像头进行互联网.微信直播,我们知道摄像头直播的春天了.将安防摄像头或NVR上的视频流转成互联网直播常用的RTMP.HTTP-FLV.HLS等流格式再分发给用户端进行直播,不管身处何地都可以通过移动通讯设备查看监控设备,这些功能是EasyNVR互联网直播系统研发和设计的初衷和基础功能.另外EasyNVR增值功能是可通过接口二次集成在自己的原有的web业务系统实现网页.H5无插件实时直播,但是用户一直困惑于如何获取直播…

我们在实现一套EasyNVR无插件直播方案时,选择了采用厂家无关化的通用协议RTSP/Onvif接入摄像机IPC/NVR设备,总所周知,Onvif是摄像机的发现与控制管理协议,Onvif用到的流媒体协议也是RTSP,那么,我们在摄像机/NVR流媒体接入上,就是直接采用统一的RTSP协议接入: 然而,在RTSP协议上,由于各个厂家都有不同的处理方法,比如 海康.大华.雄迈.宇视.天地伟业等厂家的RTSP地址规则就不一样,在有Onvif协议支持的设备还好一些,可以通过Onvif将摄像机的RTSP地址…

背景需求 对于摄像机直播,客户反馈的最多就是实现web直播.摆脱插件,可以自定义集成等问题, 对于熟悉EasyNVR已经完美的解决了这些问题.然而对于web播放也存在一些问题,通常我们web播放RTMP流使用的是flash,在这个过程中就会出现一个问题,随着web一直播放直播时间的增加,视频直播的延时也会累积起来,延时也就越大. 问题分析 通过自我调研和客户反馈得出在ckplayer.videojs.aliplayer等播放器都会有类似问题,出现该问题的原因在于我们播放rtmp视频流的时候启用了…

背景需求 在互联网飞速发展的时代,开发者常会说的一个词就是"跨平台".自从移动端的用户需求越来越大,H5逐渐发展,跨平台似乎已经成为了软件开发不可或缺的技术.EasyNVR互联网直播系统无论是PC浏览器还是手机APP.手机浏览器.微信客户端,都可以无缝接入,摒弃浏览器插件这种受限的用户接入方式,轻量.友好地进行全部直播.录像.检索.回放等功能的对接,一套系统,全终端兼容! 在展示界面上,EasyNVR已简洁.轻便.清新的风格深受广大用户的喜欢,同时针对用户在使用过程中的需求,支持多通道…

想实现网络监控摄像头进行视频直播的朋友门应该知道,方法其实非常简单,你不需要使用支持直播的网络摄像机,只需要经过一套流媒体服务器将监控摄像头的RTSP视频流转为RTMP\HLS\HTTP-FLV视频流,然后将流地址在网页.微信.或者推流到主流免费的直播平台上,如YOUTUBE.斗鱼等.该方案适合所有网络摄像头,因为他们几乎都支持RTSP协议,你可以使用海康.大华等等厂家的设备,选择范围广,操作简单. 需求分析 对于使用EasyNVR和EasyDSS的用户来说都知道,我们的产品是使用rtsp流来进…

问题背景 在工控机上运行EasyNVR,WEB访问出现设备在线,但是视频没有快照和无法正常直播: 问题原因分析 通过上工控机发现是由于磁盘空间被占满导致的软件运行收到影响. 解决问题分析 由于录像文件沾满磁盘导致的EasyNVR软件运行收到影响,我们可以将软件的运行目录和录像放在不同磁盘下,即使录像占满磁盘,也不会影响到软件的正常运行.我们可以i通过软链接形式来解决这个问题. **Linux软链接的使用 ** ln -s 这是linux中一个非常重要命令,它的功能是为某一个文件在另外一个位置建立…

背景 现在的前端项目越来越复杂,在不同的客户端会产生各种在开发人员机器上不会出现的问题.当用户报告一个问题给开发人员的时候,开发人员无法直接定位问题.在此前,听过一次鹅厂的前端人员,他们对QQ里面的网页监控的一个讲座,深有感触.但是鹅厂是自己开发了一系统,从开发到运维到错误分析,是一整套的体系.对于我们的项目,我们不可能选择自己开发,在网上找到一个开源的产品 [ Sentry ],基本体现了鹅厂的那套思路. 关于 Sentry Sentry 官网 以下是官网首页关于Sentry的介绍 Stop…

EasyNVR场景需求 基础:不管是城市监控还是园区管理或者是幼儿园监控,这些安防监控需求已经成为我们生活中不可或缺的重要一环,这不仅仅是提升城市管理水平和人民群众安全感的现实需求,也是完善社会治安消防的重要板块: 便捷:随着科技水平的提高,对于互联网服务,电脑不再是唯一选择,智能手机.平板电脑.特定的移动终端等都是可选择的用户终端硬件方式,因此,我们有理由要求我们的摄像机直播观看也能跟上潮流,可以做到随时随地看我想看: 完整:安防直播的需求必然会伴随着是否需要实时录像的存储,因此将实时的视频流…

背景分析 熟悉EasyNVR产品的小伙伴应该知道,EasyNVR主要针对的是安防类的项目,通过RTSP/onvif协议将前端高清网络摄像机IPC.NVR等接入进来,然后将设备端的音视频通过采集.转换,输出RTMP.HLS.HTTP-Flv格式直播流,进行全平台无插件直播. 对于动态网站,要实时更新网站的信息,通过接口来获取实时信息是一个必不可少的部分.EasyNVR可以接入IPC等前端设备,必须要实时获取到对应的IPC实时信息进行展示. 本篇主要说明Ajax来获取数据 以EasyNVR通道接口进…

前言介绍 在web前端的网页设计中,为了展示出简洁的网页风格和美观的效果,往往会使用弹窗效果在EasyNVR前端页面录像检索功能时,必然会播放录像,如果单独为播放录像文件排一个界面,用户在使用上会更加繁琐,在外观上也不是很美观. 真的弹了个窗户出来了! 基于bootstrap可以来开发出弹窗效果图 Bootstrap 模态框(Modal)插件 模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. 弹…

背景介绍 EasyNVR核心在于摄像机的音视频流的获取.转换.转码与高性能分发,同时同步完成对实时直播流的录像存储,在客户端(PC浏览器.Android.iOS.微信)进行录像文件的检索.回放和下载. 在保证EasyNVR和前端设备之间网络相通的基础条件下,EasyNVR通过获取数字网络摄像机视频流完成音视频的采集,然后由EasyNVR内部实现流媒体协议转换.转码和流媒体分发工作,最终可以分发出RTMP.HTTP-FLV和HLS流,EasyNVR自身也可以对实时视频流进行存储和管理,同时Easy…

背景描述 HLS (HTTP Live Streaming)是Apple的动态码率自适应技术,主要用于PC和Apple终端的音视频服务,包括一个m3u(8)的索引文件,TS媒体分片文件和key加密串文件.HTML5直接支持这个流地址,因此只要是支持H5的设备都可以解码播放. 问题概述 EasyNVR团队在进行多屏开发时,由于多屏功能不需要在手机端展示(pc端多播放为RTMP,手机端播放为HLS),因此只注意到了引用video.js来进行rtmp的播放.但实际使用中,由于项目需求不同,hls流的播…

背景分析 EasyNVR整套方案的架构中,涉及到前端设备(摄像机IPC.硬盘录像机NVR.编码器等).流媒体服务端(EasyNVR).客户端终端设备(PC.浏览器.Android.iOS.微信). 在保证EasyNVR和前端设备之间网络相通的基础条件下,EasyNVR通过获取数字网络摄像机视频流完成音视频的采集,然后由EasyNVR内部实现流媒体协议转换.转码和流媒体分发工作,最终可以分发出RTMP.HTTP-FLV和HLS流,EasyNVR自身也可以对实时视频流进行存储和管理,同时EasyNV…

背景分析 随着互联网基础设施建设的不断完善和发展,带宽的不断提速,尤其是光纤入户,4G/5G/NB-IoT各种网络技术的大规模商用,视频随时随地可看.可控的诉求越来越多,尤其是移动应用技术和前端技术的普及和发展,PC.手机.微信各种终端的支持需求在各行各业越来越受到青睐和重视,强制性地要求用户只能使用IE系列浏览器.强制用户只能到设备内网才能看到监控的限制,已经越来越不符合商业规律,而在传统监控行业里面,互联网思维.架构和技术完全可以成功引入,尤其是在移动互联网.物联网方面的技术,完全能够满足新…

背景分析 最近在使用EasyNVR的过程中,很多小伙伴咨询关于接口调用的问题,初步判断应该是遇到权限问题(401 Unauthorized).EasyNVR为第三方系统和应用提供了标准的API接口,方便对接二次开发为专属于自己企业的互联网直播平台.接口一般分为接口定义者和接口调用者,定义者可以规定接收参数的类型及返回形式,而接口定义者则只能完全按照接口定义者规定的参数进行访问.就叫是我们所说的webService(网络服务). 本篇博文将基于自身对EasyNVR接口的调用和一些用户的反馈的问题来…

EasyNVR网页摄像机直播方案 EasyNVR是一款拥有完整.自主.可控知识产权,同时又能够具备软硬一体功能的安防互联网化流媒体服务器,能够通过简单的网络摄像机通道配置,将传统监控行业里面的高清网络摄像机IP Camera.NVR等具有RTSP.Onvif协议输出的设备接入到EasyNVR,EasyNVR能够将这些视频源的音视频数据进行拉取,转换为RTMP/HLS,进行全平台终端H5直播(Web.Android.iOS),并且EasyNVR能够将视频源的直播数据对接到第三方CDN网络,实现互联…

最近在做某地市移动公司景观直播的项目时,遇到一个问题,当我们部署EasyNVR为系统服务后,居然出现了无法启动服务的现象,表面上看,提示是系统服务启动失败,实际通过查看windows 系统日志: 查找了很多百度.Google,发现基本都是来回复制的内容,没有干货,于是自己尝试了一下通过添加exe可执行文件用户权限的方法,解决了问题: 注意:这里我们只是简单的把Everyone赋上了所有权限,正常运维过程中,系统服务应该是给Network Service这个用户赋上权限! 成功运行: 关于Easy…

使用EasyNVR的用户都有知道,由于EasyNVR是将设备与EasyNVR的通道进行绑定的,因此EasyNVR是通过手动的通道配置来进行设备接入的,这样可以做到将设备的和通道对应的接入.但是,如果手头设备数量过多,这样,通道的配置也是一个不小的工作量. 解决方案 方案一: 首先,我们需要了解到的是设备的配置数据是存在软件包根目录的db文件中,EasyNVR使用的数据库是sqllite.因此,我们处理方式的一个手段就将数据库打开,手动的更改数据库来进行数据的配置. 数据库位置->软件包根目录ea…

EasyNVR授权方式分为软件的授权和硬件授权两种方式,软件授权需要在软件输入永久邀请码可以激化永久授权 起初我们的界面设计是为了满足功能的需求就是 ,用户可以输入激活码提交,完成永久授权. 在实际的应用过程中我们发现由于输入框自身大小的原因,我们的机器码有事无法完全展示给用户,不方便用户的自我检查激活码是否准确.因此我们考虑使用可以方便拉伸改变大小的输入框. 实施流程及遇到问题 对于可以自定义改变打的大小的输入框样式,第一个想到的是, 然而悲剧的是斌没有很好的兼容性,可以很好的在chrome.…

背景分析 众所周知,EasyNVR不拘泥.不受限于摄像机的品牌厂商及其配套平台,只要是网络监控摄像机IPC.硬盘录像机NVR.且设备支持标准的RTSP/Onvif协议,都可以接入实时视频流进入EasyNVR系统进行直播.录像.检索与回放服务.关于EasyNVR,可以移步基于EasyNVR实现RTSP/Onvif监控摄像头Web无插件化直播监控具体了解.同时EasyNVR支持使用onvif协议进行设备发现.云台控制.onvif地址获取等功能. 本篇博文着重对EasyNVR如何进行设备发现进行说明…

背景介绍 在之前的博客中<基于EasyNVR实现RTSP/Onvif监控摄像头Web无插件化直播监控>,对EasyNVR所实现的功能我们已经有较多描述,这些也在方案地址:http://www.easynvr.com/, 演示地址:http://demo.easynvr.com:10800/#/index/icons中可以直观地看到功能点和适用的场景,在此就不多说了: 本文主要介绍如何基于EasyNVR二次开发,实现自己的一套业务流程: 我们通常在构架一套视频SaaS应用的过程中,将平台设计为3…