[buffer-controller]: Error encountered while trying to append to the video SourceBuffer

[Andyczc]

What version of Hls.js are you using?

1.1.4-0.canary.8150

What browser (including version) are you using?

Chrome Version 93.0.4577.82 (Official Build) (x86_64)

What OS (including version) are you using?

MAC OS (and other)

Test stream

No response

Configuration

{
        maxBufferSize: 320 * 1000 * 1000,
        "debug": true,
        "enableWorker": true,
        "lowLatencyMode": true,
        "backBufferLength": 90
      }

Additional player setup steps

No response

Checklist

• [X] The issue observed is not already reported by searching on Github under https://github.com/video-dev/hls.js/issues
• [X] The issue occurs in the stable client (latest release) on https://hls-js.netlify.com/demo and not just on my page
• [X] The issue occurs in the latest client (main branch) on https://hls-js-dev.netlify.com/demo and not just on my page
• [X] The stream has correct Access-Control-Allow-Origin headers (CORS)
• [X] There are no network errors such as 404s in the browser console when trying to play the stream

Steps to reproduce

1. Manually adjust the playback progress to 01:19:20 2.Waiting to play to 01:19:26

Expected behaviour

Handling exceptions

What actually happened?

Console reports error, player stuck

Console output

[log] > [stream-controller]: Buffered main sn: 1587 of level 0 [4764.029,4770.017]
hls.light.js:2995 [log] > [stream-controller]: PARSED->IDLE
hls.light.js:2289 [log] > [stream-controller]: Loading fragment 1588 cc: 0 of [0-1791] level: 0, target: 4770.017
hls.light.js:2995 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls-demo.js:2422 The video playback was aborted due to a corruption problem or because the video used features your browser did not support - PIPELINE_ERROR_DECODE: Failed to send audio packet for decoding: {timestamp=4766788333 duration=21333 size=171 is_key_frame=1 encrypted=0}
handleVideoEvent @ hls-demo.js:2422
error (async)
addVideoEventListeners @ hls-demo.js:2343
loadSelectedStream @ hls-demo.js:1827
(anonymous) @ hls-demo.js:1620
dispatch @ jquery.min.js:3
r.handle @ jquery.min.js:3
hls.light.js:2100 [log] > [stream-controller]: Loaded fragment 1588 of level 0
blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:3250 [warn] > Audio frame @ 4770.011s overlaps nextAudioPts by -49 ms.
remuxAudio @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:3250
remux @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:2800
transmuxUnencrypted @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:1014
transmux @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:1001
push @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:852
(anonymous) @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:122
blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:3274 [warn] > [mp4-remuxer]: Injecting 1 audio frame @ 4770.374s due to 21 ms gap.
remuxAudio @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:3274
remux @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:2800
transmuxUnencrypted @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:1014
transmux @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:1001
push @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:852
(anonymous) @ blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:122
blob:null/d68a032c-df3a-4215-8ef1-db4bf4b51b87:938 [log] > [transmuxer.ts]: Flushed fragment 1588 of level 0
hls.light.js:2995 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.light.js:3987 [warn] > [buffer-operation-queue]: Unhandled exception executing the current operation
executeNext @ hls.light.js:3987
append @ hls.light.js:3948
onBufferAppending @ hls.light.js:3445
emit @ hls.light.js:310
emit @ hls.light.js:13369
trigger @ hls.light.js:13374
bufferFragmentData @ hls.light.js:2426
_handleTransmuxComplete @ hls.light.js:7992
handleTransmuxComplete @ hls.light.js:11033
onWorkerMessage @ hls.light.js:10994
hls.light.js:3416 [error] > [buffer-controller]: Error encountered while trying to append to the video SourceBuffer DOMException: Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attribute is not null.
    at BufferController.appendExecutor (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3840:8)
    at Object.execute (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3379:16)
    at BufferOperationQueue.executeNext (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3985:19)
    at BufferOperationQueue.append (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3948:12)
    at BufferController.onBufferAppending (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3445:20)
    at EventEmitter.emit (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:310:33)
    at Hls.emit (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:13369:26)
    at Hls.trigger (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:13374:19)
    at StreamController.bufferFragmentData (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:2426:14)
    at StreamController._handleTransmuxComplete (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:7992:14)
onError @ hls.light.js:3416
executeNext @ hls.light.js:3988
append @ hls.light.js:3948
onBufferAppending @ hls.light.js:3445
emit @ hls.light.js:310
emit @ hls.light.js:13369
trigger @ hls.light.js:13374
bufferFragmentData @ hls.light.js:2426
_handleTransmuxComplete @ hls.light.js:7992
handleTransmuxComplete @ hls.light.js:11033
onWorkerMessage @ hls.light.js:10994
hls-demo.js:2148 Error event: {type: 'mediaError', parent: 'main', details: 'bufferAppendError', err: DOMException: Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attrib…, fatal: false}
(anonymous) @ hls-demo.js:2148
emit @ hls.light.js:310
emit @ hls.light.js:13369
trigger @ hls.light.js:13374
onError @ hls.light.js:3442
executeNext @ hls.light.js:3988
append @ hls.light.js:3948
onBufferAppending @ hls.light.js:3445
emit @ hls.light.js:310
emit @ hls.light.js:13369
trigger @ hls.light.js:13374
bufferFragmentData @ hls.light.js:2426
_handleTransmuxComplete @ hls.light.js:7992
handleTransmuxComplete @ hls.light.js:11033
onWorkerMessage @ hls.light.js:10994
hls.light.js:3987 [warn] > [buffer-operation-queue]: Unhandled exception executing the current operation
executeNext @ hls.light.js:3987
append @ hls.light.js:3948
onBufferAppending @ hls.light.js:3445
emit @ hls.light.js:310
emit @ hls.light.js:13369
trigger @ hls.light.js:13374
bufferFragmentData @ hls.light.js:2426
_handleTransmuxComplete @ hls.light.js:8015
handleTransmuxComplete @ hls.light.js:11033
onWorkerMessage @ hls.light.js:10994
hls.light.js:3416 [error] > [buffer-controller]: Error encountered while trying to append to the audio SourceBuffer DOMException: Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attribute is not null.
    at BufferController.appendExecutor (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3840:8)
    at Object.execute (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3379:16)
    at BufferOperationQueue.executeNext (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3985:19)
    at BufferOperationQueue.append (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3948:12)
    at BufferController.onBufferAppending (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:3445:20)
    at EventEmitter.emit (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:310:33)
    at Hls.emit (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:13369:26)
    at Hls.trigger (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:13374:19)
    at StreamController.bufferFragmentData (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:2426:14)
    at StreamController._handleTransmuxComplete (file:///Users/zhichuncheng/Downloads/hls.js-master/demo/hls.light.js:8015:12)
onError @ hls.light.js:3416
executeNext @ hls.light.js:3988
append @ hls.light.js:3948
onBufferAppending @ hls.light.js:3445
emit @ hls.light.js:310
emit @ hls.light.js:13369
trigger @ hls.light.js:13374
bufferFragmentData @ hls.light.js:2426
_handleTransmuxComplete @ hls.light.js:8015
handleTransmuxComplete @ hls.light.js:11033
onWorkerMessage @ hls.light.js:10994
hls-demo.js:2148 Error event: {type: 'mediaError', parent: 'main', details: 'bufferAppendError', err: DOMException: Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attrib…, fatal: false}
(anonymous) @ hls-demo.js:2148
emit @ hls.light.js:310
emit @ hls.light.js:13369
trigger @ hls.light.js:13374
onError @ hls.light.js:3442
executeNext @ hls.light.js:3988
append @ hls.light.js:3948
onBufferAppending @ hls.light.js:3445
emit @ hls.light.js:310
emit @ hls.light.js:13369
trigger @ hls.light.js:13374
bufferFragmentData @ hls.light.js:2426
_handleTransmuxComplete @ hls.light.js:8015
handleTransmuxComplete @ hls.light.js:11033
onWorkerMessage @ hls.light.js:10994
hls.light.js:2995 [log] > [stream-controller]: PARSING->PARSED
hls.light.js:2220 [log] > [stream-controller]: Buffered main sn: 1588 of level 0 [4764.029,4770.017]

Chrome media internals output

render_id: 14689
player_id: 302
origin_url: http://10.216.23.4:8082/
kFrameUrl: http://10.216.23.4:8082/hls.html
kFrameTitle: Document
url: blob:http://10.216.23.4:8082/ad967137-5e82-470c-851f-3e269b7f33c0
kTextTracks: 
info: Selected video track: []
pipeline_state: kStopped
kAudioTracks: [object Object]
kVideoTracks: [object Object]
kIsAudioDecryptingDemuxerStream: false
kAudioDecoderName: FFmpegAudioDecoder
kIsPlatformAudioDecoder: false
kIsVideoDecryptingDemuxerStream: false
kVideoDecoderName: VDAVideoDecoder
kIsPlatformVideoDecoder: true
debug: (Log limit reached. Further similar entries may be suppressed): Audio buffer splice at PTS=225915000us. Trimmed tail of overlapped buffer (PTS=225914333us) by 20666us.
dimensions: 768x576
kResolution: 768x576
duration: 5382.144999
pipeline_buffering_state: [object Object]
event: kPause
seek_target: 4762.111116
audio_buffering_state: [object Object]
error: audio error during playing, status: PIPELINE_ERROR_DECODE
pipeline_error: PIPELINE_ERROR_DECODE

[dylanjha]

@Andyczc thanks for surfacing. Do you have a playlist available that can be used on the demo page to reproduce this issue?

[write2art]

+1 with the same issue here. Console log is almost the same - no reason to post the duplicate here. The only addition is comment about this part of the config:

{
        maxBufferSize: 320 * 1000 * 1000,
}

If you set maxBufferSize more than 180mb (approx) you get this error. Looks like there is some additional restrictions which do not allow appending to buffer longer than that.

Also it does not look like the stream matters.

[Andyczc]

@dylanjha Thank you for your reply, because of some privacy issues, I am not comfortable to upload the video of the client's problem.

My guesses of the possibilities.

1. When the .TS stream clip was transmitted under UDP protocol, there was a frame drop during the network transmission, resulting in a parsing error.
2. when playing a VOD file, the VOD itself some frames have problems leading to playback errors.

[invalidtask]

Experiencing this issue on the latest build when scrubbing using Wowza nDVR.

[robwalch]

Hi @invalidtask,

Please file a new issue with a sample stream and steps to the reproduce. And, be sure to indicate the version of the build in your bug report.

[robwalch]

hls-demo.js:2422 The video playback was aborted due to a corruption problem or because the video used features your browser did not support - PIPELINE_ERROR_DECODE: Failed to send audio packet for decoding: {timestamp=4766788333 duration=21333 size=171 is_key_frame=1 encrypted=0}

Sounds like the issue is related to the content, not the buffer size. Cannot reproduce or further triage without a sample stream that can be used to reproduce the issue.

[lnstadrum]

Same error here. If ever this could help:

• The same stream plays properly in Firefox and Chromium on a laptop running linux, but crashes in Firefox and Chrome on an Android phone (Pixel 5) after a very first second or so. It also plays well on another Android phone (Samsung) in Chrome. The same hls.js and server instance in all the tests, all in a local network.
• Error message from Firefox (Pixel 5):

[warn] > [buffer-operation-queue]: Unhandled exception executing the current operation [hls.light.min.js:1:222717]
[error] > [buffer-controller]: Error encountered while trying to append to the audio SourceBuffer DOMException: An attempt was made to use an object that is not, or is no longer, usable

• Error message from Chrome (Pixel 5):

[warn] > [buffer-operation-queue]: Unhandled exception executing the current operation
[error] > [buffer-controller]: Error encountered while trying to append to the audio SourceBuffer DOMException: Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attribute is not null.

• The behavior is the same for the both browsers on that device except for the ending. Firefox displays a fancy message "video can't be played because the file is corrupt" on a grayish background, while playback in Chrome just dumbly hangs.
• The stream is produced with a homemade implementation on yet another android phone (a relatively old Huawei) using its native android codecs (H.264 and AAC). Other streams coming from the same device lead to the same error. However, tons of other streams produced with the same app on other Android phones play smoothly in different mobile and desktop browsers with the rest being the same.
• All this is completely repeatable and reproducible from one stream to another when the same devices are used.

[robwalch]

Hi @lnstadrum,

What happens when attempting to reproduce the issue against dev with #5731 here: https://bugfix-fix-media-source-clos.hls-js-4zn.pages.dev/demo/

Do you have a sample you could share?

Can you please share the Android and Chrome versions you used to reproduce the issue on Pixel 5?

Are there error messages preceding the one(s) that you shared? This error message would only be displayed after the media element is in an error state and/or video/MediaSource has been detached and is no longer usable. So it is likely that a decode error occurred before this error, which doesn't tell us much. The branch above should handle these kind of issues better so that the player does not try to access or append media after the MediaSource has been closed because of another error.

An attempt was made to use an object that is not, or is no longer, usable

[write2art]

[warn] > [buffer-operation-queue]: Unhandled exception executing the current operation [hls.light.min.js:1:222717]
[error] > [buffer-controller]: Error encountered while trying to append to the audio SourceBuffer DOMException: An attempt was made to use an object that is not, or is no longer, usable

I had a similar issue, but my problem was the buffer size itself. Looks like the browser has some limitations on memory allocated for a single tab, so the player can't use more than that. If the buffer is too big, there are just not enough memory for it.

I've been playing with different streams - the lower the quality of the stream, the longer buffer length can be achieved (in seconds).

[robwalch]

Hi @write2art,

I had a similar issue, but my problem was the buffer size itself. Looks like the browser has some limitations on memory allocated for a single tab, so the player can't use more than that. If the buffer is too big, there are just not enough memory for it.

If that was the case we should be seeing QuotaExceededError Dom exception on append, or an OOM error on the page.

The full logs originally submitted follow a PIPELINE_ERROR_DECODE which suggests invalid media was appended putting the HTMLMediaElement and the browser MediaSource into an error state. A SourceBuffer DOMException could also occur is the MediaSource was closed improperly or something tried to use it after closing it, rather than resetting the MediaSource.

Please file new issues with full logs and steps to reproduce so that we can see if your particular path to getting a SourceBuffer DOMException is avoidable.

[mashirozx]

In my condition, I'm trying to play video in chromium runtime of VSCode (for theme personalization, DON'T LAUGH AT ME):

And finally I found that it seems that the errors disappeared after I removed the audio from the video file.

FYI. https://superuser.com/questions/268985/remove-audio-from-video-file-with-ffmpeg

[robwalch]

Closing as a sample has not been provided and addition comments reproducing the same error but for different reasons should be filed as new issues.