Skip to content

Instantly share code, notes, and snippets.

@aameralduais

aameralduais/README.md

Forked from feklee/README.md
Created August 2, 2017 18:31
Show Gist options
  • Save aameralduais/9ff28fef693102a142a61286c7a392d2 to your computer and use it in GitHub Desktop.
Save aameralduais/9ff28fef693102a142a61286c7a392d2 to your computer and use it in GitHub Desktop.
Download ZIP
Notes and experiments concerning HTML5 streaming, with an emphasis on live streaming
Raw
README.md

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

Raw
live.html
<!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>
Raw
nginx.conf
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
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment