本指南說明如何在對隨選影片 (VOD) 串流使用動態廣告插播 (DAI) 時,使用 IMA DAI SDK 導入書籤。本文假設導入了有效的 IMA DAI 導入作業,例如開始使用一文中列出的導入方式。
什麼是書籤?
書籤是指儲存內容串流中特定位置的功能,然後再返回。假設使用者觀看內容五分鐘後離開該影片串流,然後再返回其中。書籤功能會儲存使用者在串流中的位置,讓串流可以從上次中斷的地方繼續,讓觀眾享有流暢的體驗。
內建 DAI 書籤功能
將 DAI 串流加入書籤時,您必須在使用者離開影片時記錄串流 ID 和時間。當使用者回訪時,重新要求串流並跳轉至已儲存的時間。由於請求串流的每個執行個體都可包含不同時間長度的廣告插播,因此僅儲存串流時間是無法運作的。您要做的都是從相同的內容時間繼續。
轉換方法
IMA DAI SDK 提供一組方法,可針對特定串流時間和串流時間提出內容時間。您可以使用這些轉換方法儲存加入書籤的內容時間,然後在新的串流執行個體中搜尋對應的串流時間。做法如下,包括一個範例應用程式連結,當中顯示可正常運作的書籤實作。
正在儲存書籤
在暫停內容播放器時儲存書籤。
onPause() {
var bookmarkTime = Math.floor(
streamManager.contentTimeForStreamTime(videoElement.currentTime));
}
正在載入書籤
重新要求串流時,請載入書籤。
function loadUrl(url) {
hls.on(Hls.Events.MANIFEST_PARSED, () => {
var startTime = 0;
if (bookmarkTime) {
var startTime = streamManager.streamTimeForContentTime(bookmarkTime);
// Seeking on load triggers the onSeekEnd event, so treat this seek as
// if it's snapback. Without this, resuming at a bookmark kicks you
// back to the ad before the bookmark.
isSnapback = true;
}
hls.startLoad(startTime);
videoElement.addEventListener('loadedmetadata', () => { videoElement.play(); });
});
hls.loadSource(url);
hls.attachMedia(videoElement);
}
範例應用程式
下載範例應用程式,查看書籤實作。