HLS plugin

This plugin implements an HLS loader plugin that is capable of playing .m3u8 source files. The use of this plugin has the same caveats as the use of hls.js which primarily means that the MediaSource API must be available in the browser (except for iOS, ipadOS and macOS which offer native HSL support).

Installation

Include the plugin next to the core player:

<script src="//cdn.flowplayer.com/releases/native/3/stable/flowplayer.min.js"></script>
<script src="//cdn.flowplayer.com/releases/native/3/stable/plugins/hls.min.js"></script>

Configuration

The plugin is configured in the top-level configuration under the hls namespace. The Wowza Flowplayer configuration properties are listed in the following table.

Example

var player = flowplayer('#container',
  { src: '//edge.flowplayer.org/bauhaus.m3u8',
    hls : { native: true },
    token: 'your player token'
  })

When using either of the following code samples, you can add custom functions like XHR headers for signed cookies or custom headers. These code examples only work for devices that support Media Source Extensions and hls.js. Therefore, they won't work on iPhones.

hls: {
   // send (signed) cookies
   xhrSetup: function (xhr) { xhr.withCredentials = true }
 }

hls: {
  // send custom request headers
  xhrSetup: xhr => {
    xhr.setRequestHeader('id', 1)
    xhr.setRequestHeader('token', 456)
  }
}

Accessing the hls instance

The hls instance is exposed at player.hls when it is available, providing the ability to fully manipulate the underlying implementation for any custom integration necessary.

Events

There is one event specific to the plugin, hls/failover. This event fires when the integrated redundant stream failover switches to a backup stream (or back to the primary).

Currently, the event needs to be hardcoded for monitoring. It is not available in the flowplayer.events object. The failover event has two properties:

player.on("hls/failover",(ev)=>{
 ev.detail.reason = A string, the reason for the failover.
 ev.detail.stale = An object, which is the level hls is swapping from.
})