MPEG-DASH Support

Posted by On 9月 25, 2017 0 Comment

MPEG-DASH

Dynamic Adaptive Streaming over HTTP (DASH) = MPEG-DASH
Adaptive streaming technique with HTTP protocol.

This does not depend on codec.

Main files are MPD(Media Presentation Description) file and separated Segmentation files
(including multiple resolution files).

Install MP4Box

For Mac, compile from source is easy.
Access GPAC page and
follow documentation.
Some dependencies can be supported by brew.

brew install jpeg libpng faad2 sdl pkgconfig freetype libvorbis theora openjpeg libmad xvid libogg spidermonkey ffmpeg
git clone https://github.com/gpac/gpac.git
cd gpac
./configure
make
make install

After this, you can use MP4Box command.

Prepare Video

Let’s use same video as HLS.
Convert mp4 to DASH style mp4 using MP4Box

MP4Box -dash 10000 SampleVideo_1280x720_10mb.mp4#video SampleVideo_1280x720_10mb.mp4#audio

10s separate, video and audio separate.
After this, mpd file and files are generated.

Apache

Add mime types to handle files.
/Library/WebServer/Documents

dash
|- SampleVideo_1280x720_10mb_dash.mpd
|- SampleVideo_1280x720_10mb_track1_dashinit.mp4
|- SampleVideo_1280x720_10mb_track2_dashinit.mp4

Finally, I separate audio and video due to dash.js version.
Please be careful of it.

dash.js

To support DASH, dash.js is easy for Chrome and Safari.
video.js also supports.

This is simple HTML example to play video.

<!doctype html>
<head>
<script src="https://cdn.dashjs.org/latest/dash.all.min.js"></script>
</head>
<div>
 <h3>Dash Sample</h3>
 <video data-dashjs-player autoplay src="http://localhost/dash/SampleVideo_1280x720_10mb_dash.mpd" type="application/dash+xml" controls></video>
</div>
</html>

If you can just test dash.js, dash.js page prepares good sample.

<!doctype html>
<html>
    <head>
        <title>Dash.js Rocks</title>
        <style>
            video {
                width: 640px;
                height: 360px;
            }
        </style>
    </head>
    <body>
        <div>
            <video data-dashjs-player autoplay src="https://dash.akamaized.net/envivio/EnvivioDash3/manifest.mpd" controls>
            </video>
        </div>
        <script src="https://cdn.dashjs.org/latest/dash.all.min.js"></script>
    </body>
</html>

Ref

mp4をエンコードしてMPEG-DASHにして再生する

TOPICS