chrome audio corruption issue during transmuxing

[mhassman]

Hi,
First off, thank you for hls.js.. really interesting technology. :-)

I'm encountering an issue with hls.js on desktop versions of chrome - what appears to be corruption of the audio track post trans-mux. Details of platforms/versions tested below.. but, what's interesting is this same video plays fine in desktop chrome using hasplayer.js (test page: http://orange-opensource.github.io/hasplayer.js/1.2.1/dashif.html).

Test page: http://dailymotion.github.io/hls.js/demo/
Test video - option 1: http://216.129.119.216:8090/test-video1/stream.m3u8 (3 bitrates)
Test video - option 2: http://216.129.119.216:8090/test-video1/854x480.m3u8 (highest of the 3 bitrates)
(all encodes are via ffmpeg v2.8.1: AVC Baseline@L4.1 video and AAC LC audio)

Video fails on:
Chrome 46.0.2490.86 on mac osx 10.11.1
Chrome 46.0.2490.86 on windows 10
Chrome 46.0.2490.86 on windows 7
Chrome 46.0.2490.80 on windows 7
Chrome 46.0.2490.71 on windows 7
Chrome 45.0.2454.85 on windows 7
Chrome 46.0.2490.80 on ubuntu 14.04.3

Video is working:
Chrome 46.0.2490.76 on android (native hls & hls.js)
Firefox 42.0 on android (hls.js)
Firefox 42.0 on windows 7 (hls.js)
Firefox 42.0 on windows 10 (hls.js)
Firefox 42.0 on ubuntu 14.04.3 (hls.js)
Firefox 42.0 on mac osx 10.11.1 (hls.js plays, but partial video corruption during playback)
Safari 9.0.1 on mac osx 10.11.1 (native hls ok & hls.js plays, but partial video corruption during playback)
Safari on ipad 9.1 (native hls)
Edge 20.10240 on windows 10 (hls.js)

The /stream.m3u8 also plays fine in vlc 2.2.1.
Mediainfo and ffplay both report the encode as ok.

chrome://media-internals/
Timestamp Property Value
00:00:00 00 pipeline_state kCreated
00:00:00 00 event WEBMEDIAPLAYER_CREATED
00:00:00 01 url blob:http%3A//dailymotion.github.io/6ec72753-5e99-4858-9297-e14972335e32
00:00:00 05 pipeline_state kInitDemuxer
00:00:01 718 info Audio codec: mp4a.40.2
00:00:01 718 found_audio_stream true
00:00:01 736 audio_codec_name aac
00:00:01 736 duration 20
00:00:01 737 info Video codec: avc1.42c029
00:00:01 737 found_video_stream true
00:00:01 737 video_codec_name h264
00:00:01 738 pipeline_state kInitRenderer
00:00:01 832 audio_dds false
00:00:01 832 audio_decoder FFmpegAudioDecoder
00:00:01 904 video_dds false
00:00:01 904 video_decoder FFmpegVideoDecoder
00:00:01 904 pipeline_state kPlaying
00:00:01 904 seek_target 14
00:00:01 904 pipeline_state kSeeking
00:00:01 906 pipeline_state kPlaying
00:00:01 918 error audio decode error
00:00:01 918 error audio decode error during playing
00:00:01 919 pipeline_error pipeline: decode error
00:00:01 919 pipeline_state kStopping
00:00:01 923 pipeline_state kStopped

debug output from hls.js:
loadSource:http://216.129.119.216:8090/test-video1/stream.m3u8
hls.js:104 attachVideo
hls.js:266 media source opened
level-controller.js:78 manifest loaded,3 level(s) found, first bitrate:400000
demuxer.js:12 demuxing in webworker
level-controller.js:109 switching to level 0
level-controller.js:115 (re)loading playlist for level 0
buffer-controller.js:819 level 0 loaded [38,47],duration:20
buffer-controller.js:833 live playlist - first load, unknown sliding
buffer-controller.js:258 Loading 45 of [38 ,47],level 0, currentTime:14,bufferEnd:14.000
buffer-controller.js:879 Demuxing 45 of [38 ,47],level 0
buffer-controller.js:906 selected A/V codecs for sourceBuffers:mp4a.40.5,avc1.42c029
buffer-controller.js:935 parsed data, type/startPTS/endPTS/startDTS/endDTS/nb:video/14.000/16.000/14.000/16.000/20
buffer-controller.js:935 parsed data, type/startPTS/endPTS/startDTS/endDTS/nb:audio/14.076/16.125/14.076/16.125/16
buffer-controller.js:986 video buffered : [14.076488,16]
level-controller.js:109 switching to level 2
level-controller.js:115 (re)loading playlist for level 2
buffer-controller.js:258 Loading 0 of [0 ,63],level 4, currentTime:0,bufferEnd:0.000
buffer-controller.js:774 Uncaught TypeError: Failed to set the 'currentTime' property on 'HTMLMediaElement': The provided double value is non-finite.onVideoMetadata @ buffer-controller.js:774
abr-controller.js:47 Uncaught TypeError: Cannot read property 'length' of undefinedget @ abr-controller.js:47nextLoadLevel @ level-controller.js:232get @ hls.js:206tick @ buffer-controller.js:170onVideoSeeking @ buffer-controller.js:764
buffer-controller.js:819 level 2 loaded [38,47],duration:19.999998
buffer-controller.js:833 live playlist - first load, unknown sliding
buffer-controller.js:216 live playlist, switching playlist, load frag with next SN: 46
buffer-controller.js:258 Loading 46 of [38 ,47],level 2, currentTime:14,bufferEnd:16.300
buffer-controller.js:879 Demuxing 46 of [38 ,47],level 2
buffer-controller.js:935 parsed data, type/startPTS/endPTS/startDTS/endDTS/nb:video/16.000/17.842/16.000/17.842/45
buffer-controller.js:935 parsed data, type/startPTS/endPTS/startDTS/endDTS/nb:audio/16.125/17.917/16.125/17.917/15
buffer-controller.js:351 error while trying to append buffer:Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attribute is not null.,try appending latertick @ buffer-controller.js:351onFragParsed @ buffer-controller.js:956EventEmitter.emit @ events.js:80trigger @ hls.js:73onWorkerMessage @ demuxer.js:85
20buffer-controller.js:351 error while trying to append buffer:Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attribute is not null.,try appending later

Any thoughts on this?
Thnx!

[PhilKearney]

+1 I am also experiencing the same issue. Only on Chrome.

[mangui]

your playlist does not reference CODECS :

#EXTM3U
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=400000
480x270.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=600000
640x360.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=800000
854x480.m3u8

as a consequence hls.js tries to guess audio codec type by parsing audio metadata.
https://github.com/dailymotion/hls.js/blob/master/src/demux/tsdemuxer.js#L537-L555
if sampling rate is less than 24kHz, it tries to use HE-AAC. (mp4a.40.5)
in your case, sampling rate is 8kHz, but it looks like you were using AAC codec... (mp4a.40.2)
=> wrong guess => Chrome fires an error

as you can see, Chrome is quite pedantic about codec definition...
I tried
if you define CODECS in your main manifest, you should be able to playback your stream.

[mangui]

and as you can see, it does not affect Chrome/Android ... different audio/video pipeline

[mhassman]

Awesome!!
Thank you for the insight.. I'm now explicitly setting codecs and the streams are working in chrome.
Thank you!!!
:-)

[PhilKearney]

Hi there, question. Is there a way to set the codecs in JavaScript code rather than the manifest?

[mangui]

No. Cant you fix your manifest ?

[pkearney13]

Unfortunately I can't, the stream is being provided by a sports stream provider. If I were to ask them to change it what would I ask them to change? thanks.