WHAT IS MY PROBLEM?
My website's live streaming player use hls.js. From my server's stat, there is many case where player get stuck in the middle of a buffered range.
Here is my server raw stat log(removed some useless params):
tm=2019-09-27 12:04:41`bufferLevel=8.447303999999974`currentTime=158.4`buffered=[6.024,166.832]`readyState=4`ua=Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.116 Safari/537.36 QBCore/3.53.1153.400 QQBrowser/9.0.2524.400 Tencent AppMarket/4.8 GameCenter
currentTime is got by HTMLMediaElement.currentTime and buffered is got by HTMLMediaElement.buffered:
currentTime=158.4
buffered=[6.024,166.832]
readyState=4
From W3c:
If HTMLMediaElement.buffered contains a TimeRange that includes the current playback position and enough data to ensure uninterrupted playback:
- Set the HTMLMediaElement.readyState attribute to HAVE_ENOUGH_DATA.
- Playback may resume at this point if it was previously suspended by a transition to HAVE_CURRENT_DATA.
In this case, 613.3 is in the middle of [469.277,677.612], video should be progressing, but it is not.
Hls.js will periodly check currentTime has progressed every 100ms. if currentTime has not progressed for 1000ms, then hls.js will trigger STALL event and I will send a stall stat to server.
I cannot reproduce this problem on my side, it only appears on my server stat.
WHAT I'VE TRIED
shaka player has a module detect this case(https://www.ellealcatrase.eu/player2/docs/api/lib_media_stall_detector.js.html), Its comment shows that:
Some platforms/browsers can get stuck in the middle of a buffered range (e.g. when seeking in a background tab). Detect when we get stuck so that the player can respond.
but I cannot reproduce when my browser is in a background tab.
