ChatGPT 问答00001 hls.js 如何跳转到指定时间
hls.js是一个流媒体播放器库,它可以在浏览器中实现 HTTP Live Streaming (HLS) 播放。要在 hls.js 中跳转到指定时间,请遵循以下步骤:
- 在声明 Hls对象之前,将enableWorker属性设置为 false。这样可以禁用 hls.js 的 web worker 功能,以便使用更精确的跳转操作。例如:
Hls.DefaultConfig.enableWorker = false;
- 加载 video元素和Hls对象,并将其绑定在一起。例如:
var video = document.getElementById('video');
var hls = new Hls();
hls.attachMedia(video);
- 监听 Hls.Events.MANIFEST_PARSED事件,以便在启动后立即跳转到指定时间。在此事件中,我们可以调用video.currentTime属性来设置当前播放时间。例如:
hls.on(Hls.Events.MANIFEST_PARSED, function() {
  // 跳转到第30秒
  video.currentTime = 30;
});
请注意,这种方法可能会在视频还没有加载完全时失败。你可以先等待 loadedmetadata 或 canplaythrough 事件再进行跳转。
最后,在 hls.js 完成加载并绑定到 video 元素后,可以通过调用 hls.loadSource() 方法来加载 HLS 视频源。
完整的代码示例如下:
<video id="video"></video>
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<script>
  // 禁用 worker
  Hls.DefaultConfig.enableWorker = false;
  var video = document.getElementById('video');
  var hls = new Hls();
  hls.attachMedia(video);
  hls.on(Hls.Events.MANIFEST_PARSED, function() {
    // 跳转到第30秒
    video.currentTime = 30;
  });
  // 加载视频源
  hls.loadSource('path/to/video.m3u8');
</script>
    为梦想不止不休!

 
                
            
         浙公网安备 33010602011771号
浙公网安备 33010602011771号