Sample code: It does not work.

[jynxio]

Discretion

The sample code of README.md does not work, it will throw this error:

Uncaught (in promise) DOMException: Failed to execute 'appendBuffer' on 'SourceBuffer': This SourceBuffer has been removed from the parent media source.

The specific location of the error is here:

<script>
    function appendNextSegment () {
        // ......
        transmuxer.on('data', (segment) => {
            sourceBuffer.appendBuffer(new Uint8Array(segment.data)); // 👈 here!
        })
        // ......
    }
</script>

Screenshot

Environment

platform: chrome ( 97.0.4692.71 ), Windows10

[erickythierry]

same here. did you find any solution?

[jynxio]

same here. did you find any solution?

not yet

[arturparkhisenko]

In addition to that - the latest release didn't publish assets like it did before, so that's also one more reason why the sample code fails. Talking about this URL https://github.com/videojs/mux.js/releases/latest/download/mux.js.

[arturparkhisenko]

But the core of the reported problem is that with the current code sample, we're getting two data events for one updateend event of source buffer. So yes the current SourceBuffer is still in the appendBuffer state.

The simplest 1 line change we can make seems to me like this:

function appendNextSegment(){
  // reset the 'data' event listener to just append (moof/mdat) boxes to the Source Buffer
  transmuxer.off('data');
  transmuxer.on('data', (segment) =>{
    sourceBuffer.appendBuffer(new Uint8Array(segment.data));
    transmuxer.off('data'); // ⬅️ 🆕 This is added, to close the listener for the current append.
  })
  // ... rest of the code
}