如何在Chrome、Android上的Video.js中设置HLS(m3u8)的初始时间

Question

我正试图在页面加载后的某个时间开始播放HLS视频。在大多数浏览器上，这种方法运行良好：

var player = videojs("video");
player.on('canplaythrough', setInitialTime());
function setInitialTime() {
player.currentTime(300);
}

CodePen示例

然而，在Chrome上，Android视频总是从0秒开始。

我尝试在play而不是canplaythrough上触发事件，但这不是理想的解决方案，因为用户必须在单击播放按钮后等待预加载。

在Android 11上测试，Chrome 89.0.4389

Answer 1

视频是在安卓的本地HLS支持下播放的，这可能是一个问题，因为安卓的HLS支持非常有缺陷，并且事件可能在您有机会设置侦听器之前就启动了。

首先，更新Video.js.5.x现在已经很旧了。最新版本为7.11.8。同时删除已经过时的videojs-contrib-hls。旧版本默认使用浏览器的HLS支持(如果可用(，新版本使用Video.js的HTTP流而不是浏览器(Safari除外(。

其次，即使是最新的Video.js，如果在播放器初始化时视频元素已经加载了HLS视频，那么它也不会再次加载源。要避免这种情况，请使用<video-js>元素而不是<video>，或者删除source元素并使用player.src({src: 'https...', type: 'application/x-mpegURL'})加载。