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號