EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:通过接口获取实时信息
对于动态网站,要实时更新网站的信息,通过接口来获取实时信息是一个必不可少的部分。EasyNVR可以接入IPC等前端设备,必须要实时获取到对应的IPC实时信息进行展示。
本篇主要说明Ajax来获取数据。
以EasyNVR通道接口进行说明:
操作: H5列表显示;
接口:/api/v1/getchannels
返回:
1. 所有设备列表信息,在线&不在线 通道(包含快照信息)
2. 通道名称、通道号、通道快照、通道是否在线
报文:
{
"EasyDarwin" : {
"Body" : {
"ChannelCount" : "2",
"Channels" : [
{
"Channel" : 1,
"Name" : "channel1",
"Online" : 1,
"SnapURL" : "/snap/1/2016-10-24/20161024125212.jpg"
},
{
"Channel" : 2,
"Name" : "channel2",
"Online" : 0,
"SnapURL" : ""
}
]
},
"Header" : {
"CSeq" : "1",
"ErrorNum" : "200",
"ErrorString" : "Success OK",
"MessageType" : "MSG_SC_SERVER_GET_CHANNELS_ACK",
"Version" : "1.0"
}
}
}
前端可以通过Ajax来进行接口的访问来获取接口的数据;首先观察返回数据的类型;符返回数据进行处理进行分析;将返回的数据以对象形式进行遍历展示;
返回数据形式:
{EasyDarwin: {…}}
EasyDarwin
:
Body
:
ChannelCount
:
"6"
Channels
:
Array(6)
0
:
{Channel: 1, Name: "黄山小镇", Online: 1, SnapURL: "/snap/1/channel_1.jpg"}
1
:
{Channel: 2, Name: "科学大道与黄山路交口", Online: 0, SnapURL: ""}
2
:
{Channel: 3, Name: "办公室ONVIF", Online: 0, SnapURL: ""}
3
:
{Channel: 4, Name: "办公室", Online: 0, SnapURL: ""}
4
:
{Channel: 5, Name: "留学生创业园", Online: 0, SnapURL: ""}
5
:
{Channel: 6, Name: "北一环与阜阳北路高架交口", Online: 1, SnapURL: "/snap/6/channel_6.jpg"}
length
:
6
__proto__
:
Array(0)
__proto__
:
Object
Header
:
{CSeq: "1", ErrorNum: "200", ErrorString: "Success OK", MessageType: "MSG_SC_SERVER_GET_CHANNELS_ACK", Version: "v1"}
__proto__
:
Object
__proto__
:
Object
下一篇主要说明对接收到数据进行处理来进行前端展示;
关于EasyNVR
EasyNVR能够通过简单的网络摄像机通道配置,将传统监控行业里面的高清网络摄像机IP Camera、NVR等具有RTSP协议输出的设备接入到EasyNVR,EasyNVR能够将这些视频源的音视频数据进行拉取,转换为RTMP/HLS,进行全平台终端H5直播(Web、Android、iOS),并且EasyNVR能够将视频源的直播数据对接到第三方CDN网络,实现互联网级别的直播分发;
详细说明:http://www.easydarwin.org/easynvr/
获取更多信息
Copyright © EasyDarwin.org 2012-2017

EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:通过接口获取实时信息的更多相关文章
- EasyNVR摄像机无插件直播流媒体服务器前端构建之输入框样式的调整
EasyNVR授权方式分为软件的授权和硬件授权两种方式,软件授权需要在软件输入永久邀请码可以激化永久授权 起初我们的界面设计是为了满足功能的需求就是 ,用户可以输入激活码提交,完成永久授权. 在实际的 ...
- EasyNVR RTSP转HLS(m3u8+ts)流媒体服务器前端构建之:bootstrap-datepicker日历插件的实时动态展现
EasyNVR中有对录像进行检索回放的功能,且先抛开录像的回放,为了更好的用户体验过.让用户方便快捷的找到对应通道对应日期的录像视频,是必须的功能. 基于上述的需求,为前端添加一个日历插件,在日历上展 ...
- EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之_关于接口调用常见的一些问题(401 Unauthorized)
在之前的博客<EasyNVR H5流媒体服务器方案架构设计之视频能力平台>中我们描述了EasyNVR的定位,作为一个能力平台来进行功能的输出: 也就是说,在通常情况下,我们将一套视频的应用 ...
- EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:使用BootstrapPagination以分页形式展示数据信息
上一篇介绍通过接口来获取数据,本篇将介绍如何以分页形式展示出接口获取到的数据 获取到的数据往往会很多,为了追去页面的美观和方便用户的检索,需要进行分页的展示: EasyNVR可接如多通道,当我们的通道 ...
- EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:bootstrap弹窗功能的实现
在web前端的网页设计中,为了展示出简洁的网页风格和美观的效果,往往就会使用弹窗效果 在EasyNVR前端页面录像检索功能时,必然会播放录像,如果单独为播放录像文件排一个界面,用户在使用上会更加繁琐, ...
- EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:内部搜索功能的实现
上一篇介绍了处理接口获取的数据,本篇将介绍如何在接收到的数据中搜索出自己符合条件的数据: 为了页面的美观,我们往往会以分页的形式来进行数据的展示.但是,当需要展示出来的数据太多的时候,我们很难迅速的找 ...
- EasyNVR RTSP摄像机转HLS直播服务器中使用Onvif协议控制预置位
EasyNVR支持预置位控制,包括转到指定预置位,设置指定预置位,删除指定预置位 预置位在安防领域有较为普遍的应用,可以进行很多既定位置的跳转,很方便 之前我们说过如何用Onvif协议进行设备的发现, ...
- windows平台最简单的rtmp/hls流媒体服务器
feature: rtmp/hls live server for windows, double click to run,don't need config. run and quit: doub ...
- [SRS流媒体]RTMP/HLS 直播服务器simple-rtmp-server安装
一个采用MIT协议授权的国产的简单的RTMP/HLS 直播服务器,其核心的价值理念在于简单高效. 使用方法: tep 1: build srs tar xf simple-rtmp-server-*. ...
随机推荐
- HDU 6227.Rabbits-规律 (2017ACM/ICPC亚洲区沈阳站-重现赛(感谢东北大学))
Rabbits Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 262144/262144 K (Java/Others)Total S ...
- springboot 2.0 整合 同时支持jsp+html跳转
springboot项目创建教程 https://blog.csdn.net/q18771811872/article/details/88126835 springboot2.0 跳转html教程 ...
- BZOJ 4543 2016北京集训测试赛(二)Problem B: thr
Solution 这题的解法很妙啊... 考虑这三个点可能的形态: 令它们的重心为距离到这三个点都相同的节点, 则其中两个点分别在重心的两棵子树中, 且到重心的距离相等; 第三个点可能在重心的一棵不同 ...
- asp.net获取URL方法
方法如下: Request.Url.ToString()获取完整url(协议名+域名+站点名+文件名+参数):https://localhost:44300/WebForm1.aspx?abc=123 ...
- 开源日历TimesSquare在iOS7下诡异渲染的解决办法
因为没有时间自己写一个日历,所以暂时使用了一个三方的日历https://github.com/square/objc-TimesSquare 但是在iOS7下.突然产生了一个诡异的BUG..如下图: ...
- sublime的markdown插件
mac安装 shift+command+p调出package control面板,搜索install调查安装软件搜索面板 搜索需要安装markdown软件 我安装了下面两个:MarkdownLiveP ...
- 【GLSL教程】(三)在OpenGL中向shader传递信息 【转】
http://blog.csdn.net/racehorse/article/details/6634830 引言 一个OpenGL程序可以用多种方式和shader通信.注意这种通信是单向的,因为sh ...
- 25. Spring Boot使用自定义的properties【从零开始学Spring Boot】
转:http://blog.csdn.net/linxingliang/article/details/52069515 spring boot使用application.properties默认了很 ...
- 控制div属性
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- "贪心法"
有没有想过 “==” 和“= =” 的区别 , 万一编译器曲解了你的意思,那不是爽歪歪! C语言编译器会把前面的符号当做一个整体,后面的不再. 当我们遇到指针相除时: y=x/*p 编译器会怎样? 和 ...