Skip to content

Instantly share code, notes, and snippets.

@feklee
Last active April 24, 2019 16:38
Show Gist options
  • Save feklee/2e7cce9152615d81c3e6 to your computer and use it in GitHub Desktop.
Save feklee/2e7cce9152615d81c3e6 to your computer and use it in GitHub Desktop.
Notes and experiments concerning HTML5 streaming, with an emphasis on live streaming

Introduction

Collection of solutions for streaming via DASH, Dynamic Adaptive Streaming over HTTP, as of November 2014.

Recommended client: Chrome 38

Tool used for encoding live streams: FFmpeg

A popular video for testing is the Sintel Trailer.

Felix E. Klee

Wowza Streaming Server

VOD (Video On Demand)

Look at the examples.

Live

On Windows 7:

  1. Create an application in Wowza: “live”

  2. Stream:

    > ffmpeg.exe -re -i sintel_trailer-480p.mp4 -c copy ^
    -f flv rtmp://192.168.56.1/live/myStream
    
  3. Check if stream is incoming in Incoming Streams.

  4. Watch with the MPEG DASH test player.

nginx-rtmp

Here:

  • Linux

  • Home dir: /home/felix

  • Server domain: felix-xubuntu.test

Vod

Untested. Default Nginx seems to have support for VOD streaming. Maybe all that’s needed is:

  • FLV files at different qualities. MP4 should also be possible.

  • DASH manifest, which should could be created manually.

Live

  1. Download the source code for Nginx and for nginx-rtmp-module.

  2. Optionally, to avoid possible conflicts, remove any existing installation of Nginx from your system.

  3. Build and install Nginx with RTMP streaming support according to the instructions in README.md included in nginx-rtmp-module.

  4. Install ffmpeg, possibly from source. If you later also want to stream to Icecast, build as follows:

    $ ./configure --enable-libtheora --enable-libvpx --enable-libvorbis \
    --enable-libx264 --enable-avresample --enable-gpl --enable-libfaac \
    --enable-nonfree
    
  5. Start Nginx:

    $ sudo /usr/local/nginx/sbin/nginx
    

    To stop Nginx:

    $ sudo /usr/local/nginx/sbin/nginx -s stop
    
  6. Make DASH configuration (see example file) available at:

    /usr/local/nginx/conf/nginx.conf
    

    Then reload configuration:

    $ sudo /usr/local/nginx/sbin/nginx -s reload
    
  7. Make client available at ~/www/live.html (see example file).

  8. Install arut’s fork of dash.js that can do live streaming into:

    $ git clone https://github.com/arut/dash.js.git dash.js-live
    $ cd dash.js-live
    $ git checkout live
    
  9. Live recode and stream to Nginx:

    $ ffmpeg -re -i sintel_trailer-480p.mp4 -c:v libx264 -profile:v \
    baseline -c:a libfaac -ar 44100 -ac 2 -f flv \
    rtmp://felix-xubuntu.test/myapp/my-stream
    
  10. While the stream is playing, load in Chrome:

<http://felix-xubuntu.test/live.html>

Note, the DASH manifest describes the available streams. While streaming, it is available at:

http://felix-xubuntu.test/dash/my-stream.mpd

Icecast

Good for live streaming of Ogg or WebM, but doesn’t create DASH streams.

Reading

<!doctype html>
<html>
<head>
<title>DASH Live</title>
</head>
<body>
<div>
<video id="videoPlayer" controls="true"></video>
</div>
<script src="/dash.js-live/dash.all.js"></script>
<script>
(function(){
var url =
"http://felix-xubuntu.test/dash/my-stream.mpd";
var context = new Dash.di.DashContext();
var player = new MediaPlayer(context);
player.startup();
player.attachView(document.querySelector("#videoPlayer"));
player.attachSource(url);
})();
</script>
</body>
</html>
worker_processes 1;
error_log logs/error.log debug;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
server_name felix-xubuntu felix-xubuntu.test;
location /dash {
root /tmp;
add_header Cache-Control no-cache;
}
location /dash.js {
root /home/felix/www;
}
location / {
root /home/felix/www;
}
}
}
rtmp {
server {
listen 1935;
ping 30s;
notify_method get;
application myapp {
live on;
dash on;
dash_path /tmp/dash; # location of manifest and fragments
}
}
}
@Pilskalns
Copy link

Hi, I was familiar with each of tools (ffmpeg, nginx-rtmp, streaming), except dash.js and MPEG-DASH.

So far I got working live stream to nginx-rtmp and I can play it out on arut version of dash.js. Except, it works only when I start everything sequentially. If I restart page, it does not play anymore. If I restart ffmpeg, it starts playing (even without second page restart). So, I believe, it has problems to play when mpeg-dash playlist is loaded not from the begining.

In the setup is nothing fancy. Tried even multiple inputs
LiveHLS.m3u8 -> ffmpeg -> rtmp-nginx -> dash.js and
file.ts -> ffmpeg -> rtmp-nginx -> dash.js

Config:
ffmpeg -i "http://live.test/live.m3u8" -vcodec copy -acodec aac -strict -2 -ab 192k -ar 44100 -f flv "rtmp://server.test/live"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment