Estoy tratando de crear un nuevo cargador para fragmentos hls.js, pero no funciona.

Hizo todo por su doc ( https://github.com/video-dev/hls.js/blob/master/docs/API.md#loader ).

¿Por qué no funciona?

 const Loader = class { start = Date.now(); stats: LoadStats = { aborted: false, loaded: 0, retry: 0, total: 0, chunkCount: 0, bwEstimate: 0, loading: { start: this.start, first: 0, end: 0 }, parsing: { start: this.start, end: 0 }, buffering: { start: this.start, first: 0, end: 0 }, }; // @ts-ignore load = async (context, config, callbacks) => { const request = new XMLHttpRequest(); request.open('GET', context.url, true); request.responseType = context.responseType; request.onprogress = (event: ProgressEvent) => { const now = Date.now(); this.stats.loaded = event.loaded; this.stats.total = event.total; this.stats.chunkCount += 1; this.stats.bwEstimate = this.stats.loaded / (now - this.start); if (this.stats.loading.first === 0) { this.stats.loading.first = now; this.stats.buffering.first = now; } // There is no ArrayBuffer in response, XHR does not support that callbacks.onProgress(this.stats, context, new ArrayBuffer(0)); }; request.onabort = () => { this.stats.aborted = true; callbacks.onError( { code: 0, text: 'Error while loading of the fragment', }, context, request ); }; request.onreadystatechange = () => { if (request.readyState !== 4) { return; } const now = Date.now(); this.stats.loaded = request.response.byteLength; this.stats.total = request.response.byteLength; this.stats.loading.end = now; this.stats.parsing.end = now; this.stats.buffering.end = now; callbacks.onSuccess( { url: request.responseURL, data: request.response, }, this.stats, context, request ); }; request.send(); }; /** Abort any loading in progress. */ abort = function (): void {}; /** Destroy loading context. */ destroy = function (): void {}; };

Log tiene algo extraño: hls.js carga todos los segmentos, uno por uno, del 1 al 21, pero no los almacena en búfer, es decir, no puedo reproducir video, hay un cargador infinito.