This plugin provides the hlsjs
engine for
playback of HLS streams in browsers which do not
support playback of HLS in a VIDEO tag, and without the need for
Flash.
The plugin relies on the hls.js client, courtesy of dailymotion.
See: https://flowplayer.org/docs/plugins.html#hlsjs
The plugin can be used in a browserify and/or webpack environment with a commonjs loader:
var flowplayer = require('flowplayer');
require('flowplayer-hlsjs'); // Plugin injects itself to flowplayer
flowplayer('#container', {
clip: {
sources: [{
type: 'application/x-mpegurl',
src: '//stream.flowplayer.org/bauhaus.m3u8'
}]
}
});
A fully documented demo can be found here.
- packs a compatibility tested version - current: v0.5.10 - of hls.js
- by default the engine is only loaded if the browser supports MediaSource extensions reliably for playback
- configurable manual HLS quality selection
A quick way to find out whether there's a problem with the actual plugin component is to run your stream in the hls.js demo player.
For fine grained debugging load the unminified components and turn hlsjs debugging on:
<script src="//releases.flowplayer.org/6.0.5/flowplayer.min.js"></script>
<!-- unminified hls.js library -->
<script src="//releases.flowplayer.org/hlsjs/hls.js"></script>
<!-- separate hlsjs plugin component -->
<script src="//releases.flowplayer.org/hlsjs/flowplayer.hlsjs.js"></script>
<script>
// turn on hlsjs debugging
flowplayer.conf.hlsjs = {
debug: true
});
</script>
Build requirement:
cd flowplayer-hlsjs
make deps
make
- Only codecs which are valid in advanced MP4 video/audio and are supported by MSE are allowed: MPEG-4 AVC for video, AAC for audio.
- Safari's MSE implementation has fatal problems with fragmented MP4 playback - for the moment the hlsjs engine will only be loaded in Safari for debugging purposes.