Merge pull request #3755 from softworkz/fetchloaderfix

Fix Video Glitches with Fetch Loader
video-dev · Apr 13, 2021 · b14d783 · b14d783
2 parents 92bca82 + 1404009
commit b14d783
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 12 deletions.
diff --git a/src/demux/transmuxer.ts b/src/demux/transmuxer.ts
@@ -347,7 +347,12 @@ export default class Transmuxer {
     chunkMeta: ChunkMetadata
   ): TransmuxerResult {
     const { audioTrack, avcTrack, id3Track, textTrack } = (this
-      .demuxer as Demuxer).demux(data, timeOffset, false);
+      .demuxer as Demuxer).demux(
+      data,
+      timeOffset,
+      false,
+      !this.config.progressive
+    );
     const remuxResult = this.remuxer!.remux(
       audioTrack,
       avcTrack,

diff --git a/src/demux/tsdemuxer.ts b/src/demux/tsdemuxer.ts
@@ -409,7 +409,11 @@ class TSDemuxer implements Demuxer {
       id3Track,
       textTrack: this._txtTrack,
     };
-    this.extractRemainingSamples(demuxResult);
+
+    if (flush) {
+      this.extractRemainingSamples(demuxResult);
+    }
+
     return demuxResult;
   }
 
@@ -482,7 +486,12 @@ class TSDemuxer implements Demuxer {
     keyData: KeyData,
     timeOffset: number
   ): Promise<DemuxerResult> {
-    const demuxResult = this.demux(data, timeOffset, true);
+    const demuxResult = this.demux(
+      data,
+      timeOffset,
+      true,
+      !this.config.progressive
+    );
     const sampleAes = (this.sampleAes = new SampleAesDecrypter(
       this.observer,
       this.config,

diff --git a/src/types/demuxer.ts b/src/types/demuxer.ts
@@ -2,7 +2,8 @@ export interface Demuxer {
   demux(
     data: Uint8Array,
     timeOffset: number,
-    isSampleAes?: boolean
+    isSampleAes?: boolean,
+    flush?: boolean
   ): DemuxerResult;
   demuxSampleAes(
     data: Uint8Array,

diff --git a/src/utils/fetch-loader.ts b/src/utils/fetch-loader.ts
@@ -110,7 +110,7 @@ class FetchLoader implements Loader<LoaderContext> {
           stats.total = parseInt(response.headers.get('Content-Length') || '0');
 
           if (onProgress && Number.isFinite(config.highWaterMark)) {
-            this.loadProgressively(
+            return this.loadProgressively(
               response,
               stats,
               context,
@@ -175,19 +175,20 @@ class FetchLoader implements Loader<LoaderContext> {
     context: LoaderContext,
     highWaterMark: number = 0,
     onProgress: LoaderOnProgress<LoaderContext>
-  ) {
+  ): Promise<ArrayBuffer> {
     const chunkCache = new ChunkCache();
-    const reader = (response.clone().body as ReadableStream).getReader();
+    const reader = (response.body as ReadableStream).getReader();
 
-    const pump = () => {
-      reader
+    const pump = (): Promise<ArrayBuffer> => {
+      return reader
         .read()
         .then((data) => {
           if (data.done) {
             if (chunkCache.dataLength) {
               onProgress(stats, context, chunkCache.flush(), response);
             }
-            return;
+
+            return Promise.resolve(new ArrayBuffer(0));
           }
           const chunk: Uint8Array = data.value;
           const len = chunk.length;
@@ -205,14 +206,15 @@ class FetchLoader implements Loader<LoaderContext> {
             // just emit the progress event
             onProgress(stats, context, chunk, response);
           }
-          pump();
+          return pump();
         })
         .catch(() => {
           /* aborted */
+          return Promise.reject();
         });
     };
 
-    pump();
+    return pump();
   }
 }