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/
获取更多信息