video-dev / hls.js

HLS.js is a JavaScript library that plays HLS in browsers with support for MSE.
https://hlsjs.video-dev.org/demo
Other
14.87k stars 2.58k forks source link

H.265+ Playback Issue in Hls.js on Chrome (Mac and Windows) #6808

Open g0lemXIV opened 1 week ago

g0lemXIV commented 1 week ago

What do you want to do with Hls.js?

I want to play H.265+ streams in Hls.js across various platforms, explicitly aiming for consistent playback across Chrome on Mac and Windows. While H.265+ works well on Safari (Mac) and Ubuntu through Chromium browser extensions, I encounter persistent issues on Chrome (both Mac and Windows).

What have you tried so far?

Testing on Various Browsers:

  1. Safari (Mac): H.265+ plays smoothly without issues.
  2. Chromium on Ubuntu: Works correctly with browser extension support.
  3. Chrome (Mac & Windows): The player attempts to load the playlist but keeps loading indefinitely without displaying the video. Fallback with H.265: H.265 generally plays across all platforms without issues, but H.265+ support is inconsistent. Error Observed in Chrome: InvalidStateError: Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attribute is not null.

This results in a repeated loading attempt, and the video never starts. The issue is specific to Chrome and relates to compatibility or error handling with H.265+.

Attempted various settings within Hls.js to improve compatibility, but the issue persists. I seek any workaround or guidance to achieve smooth playback of H.265+ streams, especially on Chrome.

robwalch commented 1 week ago

Can you provide a sample of the "H.265+" asset you are having issues with?

It sounds like you are proving media that is not supported by the browser and perhaps your CODECS string is not accurate or Chrome is incorrectly indicating support for the profile or level you have packaged.

g0lemXIV commented 1 week ago

Thank you for your response.

Unfortunately, I can't share the actual video asset at this time. However, I can provide some debugging information that might help diagnose the issue.

Index Playlist (index.m3u8):

#EXTM3U
#EXT-X-VERSION:9
#EXT-X-INDEPENDENT-SEGMENTS

#EXT-X-STREAM-INF:BANDWIDTH=121655,AVERAGE-BANDWIDTH=81157,CODECS="hvc1.1.6.L93.b0",RESOLUTION=1280x720,FRAME-RATE=20.000
video1_stream.m3u8

Media Playlist

#EXTM3U
#EXT-X-VERSION:10
#EXT-X-TARGETDURATION:14
#EXT-X-SERVER-CONTROL:CAN-BLOCK-RELOAD=YES,PART-HOLD-BACK=1.50000,CAN-SKIP-UNTIL=84.00000
#EXT-X-PART-INF:PART-TARGET=0.60000
#EXT-X-MEDIA-SEQUENCE:5
#EXT-X-SKIP:SKIPPED-SEGMENTS=1
#EXT-X-GAP
#EXTINF:13.76000,
gap.mp4
#EXTINF:13.76000,
1a9ef5b9dd5d_video1_seg7.mp4
#EXTINF:13.76000,
1a9ef5b9dd5d_video1_seg8.mp4
#EXTINF:13.76000,
1a9ef5b9dd5d_video1_seg9.mp4
#EXT-X-PROGRAM-DATE-TIME:2024-10-28T16:13:04.123Z
#EXT-X-PART:DURATION=0.52000,URI="1a9ef5b9dd5d_video1_part72.mp4",INDEPENDENT=YES
#EXT-X-PART:DURATION=0.60000,URI="1a9ef5b9dd5d_video1_part73.mp4"

Debugging Logs from hls.js and Chrome (Mac):

ChunkDemuxer
Video rendering in low delay mode.
Cannot select DecryptingVideoDecoder for video decoding
Effective playback rate changed from 0 to 1
Selected VideoToolboxVideoDecoder for video decoding, config: codec: hevc, profile: hevc main, level: not available, alpha_mode: is_opaque, coded size: [1280,720], visible rect: [0,0,1280,720], natural size: [1280,720], has extra data: false, encryption scheme: Unencrypted, rotation: 0°, flipped: 0, color space: {primaries:BT709, transfer:BT709, matrix:BT709, range:LIMITED}
video decoder fallback after initial decode error.
Cannot select VpxVideoDecoder for video decoding
Cannot select Dav1dVideoDecoder for video decoding
Cannot select FFmpegVideoDecoder for video decoding
Error Group:
PipelineStatus
Error Code:
3
Stacktrace:
media/renderers/video_renderer_impl.cc:592
Caused by:
Error Group:
DecoderStatus
Error Code:
104
Stacktrace:
media/gpu/mac/video_toolbox_video_decoder.cc:272

Media Status:

164.663 | Media element detached
164.666 | Loading http://localhost:8888/h265plus/index.m3u8
164.670 | Loading manifest and attaching video element...
164.679 | Media element attached
179.174 | Media element detached
179.179 | Media element attached
180.734 | 1 quality levels found
180.735 | Manifest successfully loaded, trying to recover media error.
181.036 | Media element detached
181.037 | The video playback was aborted due to a corruption problem or because the video used features your browser did not support - PIPELINE_ERROR_DECODE
181.050 | Media element attached, trying to swap audio codec and recover media error.
181.226 | Media element detached
181.228 | The video playback was aborted due to a corruption problem or because the video used features your browser did not support - PIPELINE_ERROR_DECODE
181.230 | Media element attached, cannot recover. Last media error recovery failed.
181.410 | The video playback was aborted due to a corruption problem or because the video used features your browser did not support - PIPELINE_ERROR_DECODE, cannot recover. Last media error recovery failed.
Error:
181.439 | Buffer append error
181.439 | A media error occurred: bufferAppendError

What I found is that I can open the video when I encode it to hevc standard format

#EXTM3U
#EXT-X-VERSION:9
#EXT-X-INDEPENDENT-SEGMENTS

#EXT-X-STREAM-INF:BANDWIDTH=204043,AVERAGE-BANDWIDTH=204043,CODECS="hvc1.1.6.L93.90",RESOLUTION=1280x720,FRAME-RATE=25.000
video1_stream.m3u8