html5_rtsp_player.js is a Javascript library which implements RTSP client for watching live streams in your browser that works directly on top of a standard HTML element. It requires support of HTML5 Video with Media Sources Extensions for playback. Also player relies on server-side websocket proxy for retransmitting RTSP streams to browser.

It works by muxing RTP h.264 and MP4A-LATM payload into ISO BMFF (MP4) fragments.

html5_rtsp_player.js is written in ECMAScript6, and transpiled in ECMAScript5 using Babel.

Live test stream

Link to server running with websock_rtsp_proxy and test page.

HTML5 Player update test page We've added such feature which supports Local Fast Playback mode up to 2 minutes duration. In this mode, you can view the video at a speed of x0,5 to x5.

 If you want activate this mode, click on timeline.

 To return to normal playback rate, press «live». This mode is useful to see what you missed.

Browser support:

  •  Firefox v.42+
  •  Chrome v.23+
  •  OSX Safari v.8+
  •  MS Edge v.13+
  •  Opera v.15+
  •  Android browser v.5.0+
  •  IE Mobile v.11+

Not supported in iOS Safari and Internet Explorer.


npm install git://


Attach HTML Video with RTSP URL

<video id="test_video" controls autoplay src="rtsp://your_rtsp_stream/url"></video>

Setup player in your js:

import * as rtsp from 'rtsp_player';

rtsp.RTSP_CONFIG['websocket.url'] = "ws://websocket_proxy_address/ws"; // You should specify address of proxy described below

let player = rtsp.attach(document.getElementById('test_video'));

ES6 Modules support is required. You can use webpack with babel loader to build this script:

const PATHS = {
    src: {
        test: path.join(__dirname, 'test.js')
    dist: __dirname

module.exports = {
    entry: PATHS.src,
    output: {
        path: PATHS.dist,
        filename: '[name].bundle.js'
    module: {
        loaders: [
                test: /\.js$/,
                loader: 'babel',
                query: {
                    presets: ['es2015', 'stage-3', 'stage-2', 'stage-1', 'stage-0']
    resolve: {
        alias: {
            rtsp: path.join(__dirname,'node_modules/html5_rtsp/src')
> npm install bp_event bp_log bp_statemachine
> webpack --config webpack.config.js

Include compiled script into your HTML:

<script src="test.bundle.js"></script>
  • Install websocket proxy
    For Debian-based systems:
    curl -o- | dpkg --install
    apt install websockrtspproxy # Debian-based systems
    or Fedora:
    dnf install
    dnf install websock_rtsp_proxy
  • Configure port in /etc/ws_rtsp.ini
    This port should be open in your firewall. Also you can pass request to this port from your proxy. (for example:
  • Run it
    > service ws_rtsp start

RTSP player establish connection with proxy with following protocol:

  • Connect to RTSP channel by connecting websocket with "rtsp" protocol specified and get connection id
    WSP 1.0 INIT\r\n
    host <RTSP stream host>\r\n
    port <RTSP stream port>\r\n\r\n
    INIT <connection_id>\r\n\r\n
    conection_id = -1 means error
  • Connect to RTP channel by connecting websocket with "rtp" protocol
    WSP 1.0 INIT\r\n
    RTSP <connection_id achieved from RTSP socket initialization>\r\n\r\n
    INIT <connection_id>\r\n\r\n
    conection_id = -1 means error
  • RTP channel should send interleaved data with 4 byte header ($<channel> <size>). Separate RTP is not supported at this moment

More projects


Linux Kernel Module Programming for embedded platform

Development of interface modules, support chips and protocols for the particular design of the board.


U-Boot and RedBoot modification for embedded boards

Changes to the boot code in accordance with the peculiarities and differences from the reference designed board to prepare the board to boot the OS.


VHDL/Verilog FPGA programming

Converting physical interfaces on the fly. Implement algorithms in real time. The implementation of high-speed data bus. Parallel, pipelined processing.