如何为hls.js创建自定义加载程序？

Question

I'm using hls.js with video Js and I was wondering how I could implement a custom loader that loads the content using fetch API instead of XMLHttpRequest.

The following is what I managed to achive:

 hlsConfig: { loader: function() { this.load = function(url, responseType, onSuccess, onError, timeout, maxRetry, retryDelay) { var onProgress = arguments.length <= 8 || arguments[8] === undefined ? null : arguments[8]; var frag = arguments.length <= 9 || arguments[9] === undefined ? null : arguments[9]; this.url = url; if (frag && !isNaN(frag.byteRangeStartOffset) && !isNaN(frag.byteRangeEndOffset)) { this.byteRange = frag.byteRangeStartOffset + '-' + (frag.byteRangeEndOffset - 1); } this.responseType = responseType; this.onSuccess = onSuccess; this.onProgress = onProgress; this.onError = onError; this.stats = { trequest: performance.now(), retry: 0 }; this.timeout = timeout; this.maxRetry = maxRetry; this.retryDelay = retryDelay; if (self.fetch) { // use fetch API } else { // fallback to XMLHttpRequest loader } return true; } } 

Answer 1

hls.js only takes xmlHTTPrequest events. You have to modify hls.js to make it handle the input the way you like, search for 'loadsuccess' in unminified hls.js and change it to how you would handle the data yourself. Make sure the payload is the requested responseType; make sure payload is an ArrayBuffer if it asks for it, and just a plain string for empty responseType.

Answer 2

Personally I have coded the following shim in order to pass the data came from WebRTC or whatever else:

function CustomLoaderResponse(response)
{
   this.currentTarget = {};
   this.currentTarget.getResponseHeader = function() { return '' };
   this.currentTarget.response = response;
   this.currentTarget.responseText = typeof(response) == "string" ? response : '';
}
<...>
var response = new CustomLoaderResponse(/* pass string or arraybuffer here */);

I guess that the should propose handling the regular JavaScript dictionaries in the future releases of hls.js, as this can't be considered as a good practice either.