HTML5-RTSP_player_for_IP_cams

HTML5 RTSP player

Playback of RTSP video streams in browsers and mobile applications with the use of WebRTC and Websocket

For an RTSP stream to be broadcasted from an IP camera to a browser and played back in the browser without any additional plugins, the stream has to be specially prepared and converted into an HTML5 compatible format supported by browsers. The player accesses the WCS server to convert the RTSP stream into HTML5, and the server requests the RTSP stream from the camera or from another source via the RTSP protocol. The following formats can be used to play back the stream in a browser: WebRTC, MSE (Media Source Extension) and HLS.

Specifications of an RTSP HTML5 player

The video stream is captured from the RTSP source that delivers audio and video in the supported codecs, and transformed on the server side for subsequent playback in browsers and mobile devices. 

RTSP sources RTSP codecs Playback
technologies
Playback
platforms
  • IP cams
  • Media servers
  • Video surveillance
  • Conference servers
  • H.264
  • VP8
  • AAC
  • G.711
  • Speex
  • WebRTC
  • Websocket
  • MSE
  • HLS
  • Flash
  • Chrome
  • Firefox
  • Opera
  • Safari, Mac OS
  • Safari, iOS
  • IE
  • Edge
  • iOS SDK
  • Android SDK
RTSP sources
  • IP cams
  • Media servers
  • Video surveillance
  • Conference servers
RTSP codecs
  • H.264
  • VP8
  • AAC
  • G.711
  • Speex
Playback technologies
  • WebRTC
  • Websocket
  • MSE
  • HLS
  • Flash
Playback platforms
  • Chrome
  • Firefox
  • Opera
  • Safari, Mac OS
  • Safari, iOS
  • IE
  • Edge
  • iOS SDK
  • Android SDK

Diagram of RTSP video stream delivery to browsers and mobile applications

The Web Call Server connects to an IP camera or a streaming video server via the RTSP protocol, receives video and audio traffic, converts the traffic into a browser compatible format, and then shares the streaming video to users’ HTML5 pages and to mobile applications for iOS and Android.

playback_browser_ios_android_RTSP_ipcams_WebRTC

 

Step-by-step diagram of RTSP broadcast to an HTML5 browser or mobile application

The browser connects to the server via the Websocket protocol and requests the RTSP video stream. This is where the broadcast begins.

  1. The browser requests the RTSP stream
  2. The Web Call Server connects to the IP camera and requests the RTSP stream demanded by the browser
  3.  The IP camera sends audio and video traffic within the RTSP connection
  4.  The Web Call Server converts the traffic into WebRTC or Websockets and transmits it to the browser for playback

 

playback_sequence_diagram_RTSP_ipcams_WebRTC_MSE

 

An RTSP HTML5 player in Google Chrome via WebRTC

An example of the player’s operation in Chrome via WebRTC is shown in the screenshot below

example_player_after_clicking_on_start_RTSP_ipcams_WebRTC_browser

 

RTSP HTML5 player — Demo

Visit our demo server to test the operation of the RTSP HTML5 player

demo_web_call_server_RTSP_ipcams_WebRTC_browser

Test

 

Download Web Call Server 5

System requirements: Linux x86_64, 1 core CPU, 2 Gb RAM, Java

    Download Now    

Installation:

  1. wget https://flashphoner.com/download-wcs5.2-server.tar.gz
  2. Unpack and install using 'install.sh'
  3. Launch server using command 'service webcallserver start'
  4. Open the web interface https://host:8444 and activate your license

 

If you are using Amazon EC2, you don't need to download anything.

Launch WCS5 on Amazon EC2

 

Web Call Server Monthly Subscription

$75 per month

 

   Purchase   

 


Related Articles