最近動画再生プレイヤーとして、
OSSのFlowPlayerとhls.jsを使っているのですが、
ちょっとハマったところがあったので備忘録兼、理解を深めるために記載。
#概要
・FlowPlayer+hls.jsでのHLSのライブ動画配信で動画再生に失敗
・hls.jsのエラーとして以下が発生
[warn] > level controller,fragLoopLoadingError on live stream, discard
[warn] > mediaController: fragLoopLoadingError while loading frag,switch to IDLE state ...
tsファイルを取得する際に最初のtsファイルを取得後、
もう1度同じtsファイルをループして取得する事象が発生
#原因
・githubのissueから以下の記事を発見 #Githubに非常に感謝
Infinite Frag Loop Loading Error on Live Stream
[log] > parsed video,PTS:[2.345,10.385],DTS:[2.145/10.225],nb:97
[log] > parsed audio,PTS:[0.000,10.124],DTS:[0.000/10.124],nb:436
用語 | 説明 |
---|---|
PTS (presentation time stamp) | PTSはいつ再生(表示)するのかを示したタイムスタンプのこと。再生開始後2秒の時点で表示しろとかそういうタイムスタンプ |
DTS(decoding time stamp) | DTSはいつデコードするのかを示したタイムスタンプのこと。再生開始後1秒の時点でデコードしろとかそういうタイムスタンプ |
nb | ??? |
例では、キーフレームがフラグメントの開始から2.345秒後に始まるため、
最初のキーフレームより前のtsファイルはドロップされるようである。
この差分により、最初のtsファイルのロードに失敗し、再度最初のtsファイルのリロードにより、
hls.jsのロジックを混乱させて、fragLoopLoadingErrorで動画再生に失敗する。
#解決方法
映像のキーフレーム間隔をTS秒数と合わせることで解決
HLSでの映像配信を行う際には、キーフレーム間隔をtsファイルの秒数と合わせることが非常に重要。
ABRを行う場合でも、キーフレーム間隔を合わせないと映像再生に失敗する場合もある。
映像技術は調べても解決方法が見つからないことが多いので、自分で技術ノウハウを蓄積すること。
あと、Githubのissueはしっかりと見るようにすること。
#殴り書きなのであとで内容直します。