儲存及載入廣告串流書籤

選取平台： HTML5 Android iOS tvOS Roku

本指南說明如何使用 IMA DAI SDK，在隨選影片 (VOD) 串流的動態廣告插播 (DAI) 中導入書籤功能。前提是 IMA DAI 實作項目正常運作，例如「開始使用」一文中的實作項目。

什麼是書籤？

書籤功能可用來儲存內容串流中的特定位置，讓使用者稍後再回到該位置。假設使用者觀賞內容 5 分鐘後離開該視訊串流，之後再回頭繼續觀賞，這時書籤功能會儲存使用者在該串流中停止的位置，如此該串流就能從上次停止的地方繼續播放，方便觀眾順暢觀賞內容。

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);
}

範例應用程式

下載範例應用程式，查看書籤實作方式。