How to Stream and Record HTML5 Video to the Cloud

With the world rapidly moving to putting everything on the cloud, companies and organizations need to adapt and pivot in order to survive. Reduced cloud costs over the past few years, along with increased operational efficiency, and remote access have further propelled this trend.

Given these factors, and with access from any web browser, it has become essential for video surveillance systems to support HTML5 video. This is how VXG Inc. fits in: by providing end-to-end software for all video monitoring and video streaming needs, such as mobile video and web video players. Embed video to any website, source, or device, and convert video output from any file format, such as mp4 to HTML5.

Pre-HTML5 Protocols

Before HTML5 and HTML video, to have a video file play on a webpage, users would need to use a plug-in like Adobe Flash Player or VLC. With the introduction of HTML5 video streaming, users can now place videos directly into the page itself. This allows video playback on pages that are designed for mobile devices, as plug-ins like Adobe Flash Player don't work on Android or iOS.

There are several roadblocks to overcome for video surveillance and the security industry. The major obstacle is the main video streaming protocol in video security, which is Real Time Streaming Protocol (RTSP). RTSP usually creates a TCP session for a handshake between a player and a camera and then transfers media data over TCP or UDP.

The problem is that all modern Web browsers don't allow raw TCP connections. For a long time the workaround was to use a VLC plug-in. When browsers stopped supporting plug-ins and Chrome became the dominant browser, VXG was the first to introduce a Chrome plug-in (based on NaCL technology). This became a popular solution for several years as it worked with multiple sources and modern browsers. Another alternative is to ask users to use an older version of Internet Explorer with a VLC plug-in. However, that is the least robust, and user-friendly option.

HTML5 Compliance

Today, all modern browsers require strict compliance with HTML5 video players. Requiring all communication to be over HTTP or WebSocket protocols, with an exception of several special media delivery protocols like WebRTC. This gives two choices: 1) support one of the HTML5 [video embed] compliant protocols on a camera; 2) use a proxy or a cloud server to translate RTSP to HTML5 protocol.

HTML5 Directly on a Camera

There are several relatively simple ways of supporting HTML5 protocol on a camera. The easiest is to use what's called HTTP tunnelling for RTSP. This is when the whole RTSP exchange and media delivery is wrapped with HTTP packets.

Another approach, which is slightly more complex, is using a WebSocket for tunnelling. The WebSocket approach gives an option to initiate a connection from a camera. This can be very useful for connecting to a cloud and is part of a relatively new ONVIF Uplink Specification. The even more complex solution is using a P2P video protocol like WebRTC. All the above require significant changes on a camera, though HTTP tunnelling is the least complicated.

HTML5 Proxy on the Cloud

With a cloud approach, users have the flexibility of supporting all cameras including older cameras without built-in HTML5 support. The cloud acts as a proxy converting RTSP into one of the HTML5 compliant formats, such as HLS or WebRTC, or it can simply tunnel RTSP through a WebSocket. The latter approach requires a proprietary video player, while the first two protocols are supported by the majority of web browsers.

The cloud video hosting approach has many additional benefits. Once the video stream is on the cloud, users can do cloud recording, relay real-time video to a variety of video analytics services, and connect video to broadcasting servers or CDN (Content Delivery Network). The best part is this can all be done on-demand. If you need to analyze video elements from one of your cameras and only during rush hours then you'll only use resources for a short period of time and for one camera only.

Source: https://www.videoexpertsgroup.com/vxg-what-is-the-best-approach-for-html5-and-video-surveillance/