This guide describes how to build a web application using standard Cameramanager API and HTML5 web technology. The web application is able to play live video in the browser.
In this guide is explained how to build a web application with the following features:
This guide uses HLS (HTTP Live streaming) for live streaming. HLS can be played on the majority of the browsers without plugins like Adobe Flash. The only downside is that HLS live video streams have a standard delay of 6 - 8 seconds. Depending on the network this might increase. For low delay live streaming, Adobe Flash or WebRTC can be used.
This guide assumes that the reader has a basic knowledge of the following technologies:
Playing recordings using the MP4 API, we support the following browsers:
The camera footage settings should be set to h.264 encoding, cameras recording to MJPEG and MPEG4 are not supported. The audio is not supported in the browser.
1) Login using the REST API
2) Get cameras
3) Get camera streams
In the browser, you will see the standard HTML5 video player. Due to the "controls" property in the element, it contains a play/pause button, time information, a slider to move forward/backward and the user can make the video fullscreen.
The HTML5 video element can be further tuned via the following attributes:
|autoplay||With the autoplay attribute, the video will start playing automatically|
|controls||Defines whether the standard video controls are visible|
|width||Defines the width of the video|
|height||Defines the height of the video|