How can I modify the pLoader and fLoader in hls.js?

Given the current impossibility to chain multiple loaders, it is possible to define hooks to perform actions on the PlaylistLoader or on the FragmentLoader that the wrapper is extending from hls.js. Hooks are defined in the wrapperConfig, the fourth argument of the wrapper constructor.

⚠️ Performing actions on those hooks can lead to unexpected behaviors as Streamroot will rely on it afterwise

Available hooks

• fLoader

  • abort: (context) -> void
  • destroy: (context) -> void
  • load: (context, config, callbacks) -> void

• pLoader

  • abort: (context) -> void
  • destroy: (context) -> void
  • load: (context, config, callbacks) -> void

Defining a hook

The following example demonstrates how to define hooks:

const wrapperConfig = {
    hooks: {
        pLoader: {
            load = function (context, config, callbacks) {
                // Example of updating the context
                if (context.url.indexOf('playlist.m3u8') > 1) {
                    context.url += "?title=Query_string";
                }

                // Example of overriding callback to execute actions after the load
                const originalSuccessCb = callbacks.onSuccess;
                callbacks.onSuccess = function (response, stats, context) {
                    console.log("pLoader succeeded, loaded " + stats.loaded + "b");
                    originalSuccessCb(response, stats, context);
                };
            },
        }
    }
};