Apple HTTP Live Streaming (HLS)

This test page was created by Walter Ebert. The videos are based on sources provided by Sintel, the Durian Open Movie Project. The build script is available on GitLab.

Browsers that support HLS:

Apache MIME type configuration


AddType application/x-mpegurl m3u8
AddType video/mp2t ts

Note: AddType application/vnd.apple.mpegurl m3u8 #Does not work on most Android devices

Demos

HTML5
Video HTML code 

<video controls width="480" height="270" src="sintel-trailer.m3u8">



<video controls width="480" height="270">
    <source  src="sintel-trailer.m3u8" type="application/x-mpegurl">
</video>



<video controls width="480" height="270">
    <source  src="sintel-trailer.m3u8" type="application/vnd.apple.mpegurl">
</video>



<video controls width="480" height="270" src="480x270.m3u8">
Flash
Video HTML code 

<div id="flowplayer" style="width: 480px; height: 270px;"></div>
<script>
flowplayer("flowplayer", "flowplayer.swf", {
    plugins:  {
        httpstreaming: {
            url: 'flowplayer.httpstreaminghls-3.2.10.swf'
        },
        menu: {
            url: "flowplayer.menu.swf",
            items: [
                { label: "select resolution:", enabled: false }
            ]
        },
        brselect: {
            url: "flowplayer.bitrateselect.swf",
            menu: true,
        }
    },
    clip: {
        url: "sintel-trailer.m3u8",
        urlResolvers: ["httpstreaming","brselect"],
        provider: "httpstreaming",
        autoPlay: false
    }
});
</script>

Reference: Electroteque Media