Menyimpan dan memuat bookmark streaming iklan

Panduan ini menunjukkan cara menerapkan bookmark menggunakan IMA DAI SDK saat menggunakan Penyisipan Iklan Dinamis (DAI) untuk streaming video on demand (VOD). Hal ini mengasumsikan penerapan IMA DAI yang berfungsi, seperti yang disajikan di Memulai.

Apa yang dimaksud dengan bookmark?

Pemberian bookmark adalah kemampuan untuk menyimpan dan memulihkan poin tertentu dalam streaming konten. Misalnya, setelah menonton konten streaming video selama lima menit, pengguna menutupnya, lalu membukanya kembali. Fitur pemberian bookmark akan menyimpan posisi pengguna yang memungkinkan streaming dilanjutkan pada posisi terakhir yang dilihat, sehingga memberikan pengalaman yang lancar bagi penonton.

Bookmark DAI di balik layar

Saat mem-bookmark streaming DAI, Anda harus mencatat ID dan waktu streaming saat pengguna keluar dari video. Saat pengguna kembali, minta ulang streaming dan cari ke waktu yang disimpan. Karena setiap instance streaming yang diminta dapat memiliki jeda iklan dengan durasi yang berbeda, menyimpan waktu streaming saja tidak akan berfungsi. Yang benar-benar Anda inginkan adalah melanjutkan dari waktu konten yang sama.

Metode konversi sebagai solusi

IMA DAI SDK menyediakan sepasang metode untuk meminta waktu konten untuk waktu streaming tertentu dan waktu streaming untuk waktu konten tertentu. Dengan menggunakan metode konversi ini, Anda dapat menyimpan bookmarked waktu konten, lalu mencari waktu streaming yang sesuai di instance streaming baru. Berikut adalah pendekatannya, termasuk link ke aplikasi contoh yang menunjukkan penerapan bookmark yang berfungsi.

Menyimpan dan memuat bookmark streaming iklan

Menyimpan bookmark saat pemutar konten dijeda.

onPause() {
   var bookmarkTime = Math.floor(
   streamManager.contentTimeForStreamTime(videoElement.currentTime));
}

Memuat bookmark

Memuat bookmark saat meminta ulang streaming.

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

Aplikasi contoh

Download aplikasi Contoh untuk melihat implementasi bookmark.