Sample RTSP demo project with server and client
- Best approach to get RTSP streaming into web browser from IP Camera?
- HTML5 Live Video Streaming via WebSockets
- JSMpeg – MPEG1 Video & MP2 Audio Decoder in JavaScript
You can refer to the following link to install FFMPEG libaray on CentOS7.
Change into server directory and run npm install ws to install npm dependency packages.
cd server
npm install ws
First you will need to run HTTP-Websocket relay server.
node websocket-relay.js supersecretpassword 8081 27017
Here you should provide the password for authentication, HTTP listening port and Websocket listening port.
Next you will need to run ffmpeg program to receive RTSP stream from the server and push it to the relay server as HTTP traffic.
ffmpeg -i rtsp:https://<any rtsp stream URL> -f mpegts -codec:v mpeg1video -s 320x240 -b 800k -r 30 https://localhost:8081/supersecretpassword
Here the output format MUST be mpegts, since jsmpeg library which is used on the client side only supports this format. Video size parameter can be given by -s 320x240.
In the client directory, we have 1 html and 1 js file.
In the view-stream.html file, you can find the websocket URL and you should replace it with the address of your own relay server.
var canvas = document.getElementById('video-canvas');
// var url = 'ws:https://'+document.location.hostname+':8082/';
var url = 'ws:https://89.40.7.94:27017/';
var player = new JSMpeg.Player(url, {canvas: canvas});
If you open the html file, you can see the shining video streams. 😎