对于动态网站,要实时更新网站的信息,通过接口来获取实时信息是一个必不可少的部分。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/

获取更多信息

邮件:support@easydarwin.org

WEB:www.EasyDarwin.org

Copyright © EasyDarwin.org 2012-2017

EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:通过接口获取实时信息的更多相关文章

  1. EasyNVR摄像机无插件直播流媒体服务器前端构建之输入框样式的调整

    EasyNVR授权方式分为软件的授权和硬件授权两种方式,软件授权需要在软件输入永久邀请码可以激化永久授权 起初我们的界面设计是为了满足功能的需求就是 ,用户可以输入激活码提交,完成永久授权. 在实际的 ...

  2. EasyNVR RTSP转HLS(m3u8+ts)流媒体服务器前端构建之:bootstrap-datepicker日历插件的实时动态展现

    EasyNVR中有对录像进行检索回放的功能,且先抛开录像的回放,为了更好的用户体验过.让用户方便快捷的找到对应通道对应日期的录像视频,是必须的功能. 基于上述的需求,为前端添加一个日历插件,在日历上展 ...

  3. EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之_关于接口调用常见的一些问题(401 Unauthorized)

    在之前的博客<EasyNVR H5流媒体服务器方案架构设计之视频能力平台>中我们描述了EasyNVR的定位,作为一个能力平台来进行功能的输出: 也就是说,在通常情况下,我们将一套视频的应用 ...

  4. EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:使用BootstrapPagination以分页形式展示数据信息

    上一篇介绍通过接口来获取数据,本篇将介绍如何以分页形式展示出接口获取到的数据 获取到的数据往往会很多,为了追去页面的美观和方便用户的检索,需要进行分页的展示: EasyNVR可接如多通道,当我们的通道 ...

  5. EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:bootstrap弹窗功能的实现

    在web前端的网页设计中,为了展示出简洁的网页风格和美观的效果,往往就会使用弹窗效果 在EasyNVR前端页面录像检索功能时,必然会播放录像,如果单独为播放录像文件排一个界面,用户在使用上会更加繁琐, ...

  6. EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:内部搜索功能的实现

    上一篇介绍了处理接口获取的数据,本篇将介绍如何在接收到的数据中搜索出自己符合条件的数据: 为了页面的美观,我们往往会以分页的形式来进行数据的展示.但是,当需要展示出来的数据太多的时候,我们很难迅速的找 ...

  7. EasyNVR RTSP摄像机转HLS直播服务器中使用Onvif协议控制预置位

    EasyNVR支持预置位控制,包括转到指定预置位,设置指定预置位,删除指定预置位 预置位在安防领域有较为普遍的应用,可以进行很多既定位置的跳转,很方便 之前我们说过如何用Onvif协议进行设备的发现, ...

  8. windows平台最简单的rtmp/hls流媒体服务器

    feature: rtmp/hls live server for windows, double click to run,don't need config. run and quit: doub ...

  9. [SRS流媒体]RTMP/HLS 直播服务器simple-rtmp-server安装

    一个采用MIT协议授权的国产的简单的RTMP/HLS 直播服务器,其核心的价值理念在于简单高效. 使用方法: tep 1: build srs tar xf simple-rtmp-server-*. ...

随机推荐

  1. 牛客网 牛客小白月赛1 I.あなたの蛙が帰っています-卡特兰数,组合数阶乘逆元快速幂

    I.あなたの蛙が帰っています   链接:https://www.nowcoder.com/acm/contest/85/I来源:牛客网     这个题有点意思,是卡特兰数,自行百度就可以.卡特兰数用处 ...

  2. sprintf 心得

    [string print format]sprintf指的是字符串格式化命令. [主要功能]是把格式化的数据写入某个字符串中. sprintf是个变参函数. 使用sprintf对于写入buffer的 ...

  3. 关于asp.netCore3.0区域和路由配置

    在ASP.NET Core 3.0中路由配置和2.0不一样了 一.MVC 服务注册 ASP.NET Core 3.0 添加了用于注册内部的 MVC 方案的新选项Startup.ConfigureSer ...

  4. 全栈一路坑(4)——创建博客的API

    上一篇博客:全站之路一路坑(3)——使用百度站长工具提交站点地图 这一篇要搭建一个API平台,一是为了给博客补充一些功能,二是为以后做APP提供数据接口. 首先需要安装Django REST Fram ...

  5. Linux中ping不通外网

    在linux中ping www.baidu.com 无法ping通 需要修改vi /etc/resolv.conf 增加如下内容: nameserver 114.114.114.114 nameser ...

  6. redis参数配置

    redis.conf配置文件 配置项 值 说明 slave-read-only yes slave是否只读 slave-serve-stale-data yes 当slave与master断开连接,s ...

  7. Zookeeper demo增删改查

    Zookeeper 的增删改查demo代码 public class SimpleZkClient { private static final String connectString = &quo ...

  8. Predicate与filter

    转: http://blog.csdn.net/michaellufhl/article/details/6329823 怎么根据某些条件来过滤Collection的元素?我们可以在循环里面判断元素是 ...

  9. WeakReference &&reference quene &&GC

    在了解WeakReference之前,先给出一段简单的代码: public class WeakReferenceTest {public static void main(String[] args ...

  10. js传递默认形参

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...