AndroidのChromeで動画が再生されない場合がある

[MitsukiUsui]

時々AndroidのChromeで"The media playback was aborted due to a corruption problem or because the media used features your browser did not support. "というメッセージが表示されて、動画が再生されない場合がある。ページをリフレッシュすると普通に再生できることが多い。

実機デバッグでコンソールを表示してみたら、以下のようなエラーログが出ていた。

VIDEOJS: ERROR: (CODE:3 MEDIA_ERR_DECODE) The media playback was aborted due to a corruption problem or because the media used features your browser did not support. 

VIDEOJS: ERROR: (CODE:3 MEDIA_ERR_DECODE) video append of 190602b failed for segment #183 in playlist 1-chunklist_w1908009146_b314000_t64MjUwaw==.m3u8 

videojsのissueなどを調べてみると、いくつか関連するものが見つかった。

• The media playback was aborted due to a corruption problem or because the media used features your browser did not support. videojs/video.js#6278
• HLS error ("video append failed") on older Chrome/SmartTV videojs/video.js#7008
• https://gist.github.com/webgyo/c9b3c068831fce105f3e0ea04e8267c2

その中で、overrideNativeというオプションをつけると、ブラウザのHLSサポートによらずvideojsを使うようになるということで、試して見ることにする。

• https://github.com/videojs/http-streaming#overridenative

// via the constructor
var player = videojs('playerId', {
  html5: {
    vhs: {
      overrideNative: true
    },
    nativeAudioTracks: false,
    nativeVideoTracks: false
  }
});

なお、hlsと書いているコメントもあるが、vhsと書くのが正しそう。

• https://stackoverflow.com/questions/69696558/videojs-has-no-quality-level-cant-select-qualities-despite-overridenative-in

[MitsukiUsui]

どうやらIOS以外はデフォルトでtrueになっているらしく、変えても何も変わらない可能性はあるが、とりあえず試して見る。

const defaultOverrideNative = !(videojs.browser.IS_ANY_SAFARI || videojs.browser.IS_IOS);

https://github.com/videojs/http-streaming/blob/1bd22c903c3e320fae047abf3d120236939caa47/src/videojs-http-streaming.js#L1241

videojs/http-streaming#505

[MitsukiUsui]

ihponeで動画が再生できなくなったので、ロールバックする。