Закладки

В этом руководстве показано, как реализовать закладки с помощью IMA DAI SDK при использовании динамической вставки рекламы (DAI) для потоков видео по запросу (VOD). Это предполагает работающую реализацию IMA DAI, например, представленную в разделе «Начало работы» .

Что такое закладка?

Создание закладок — это возможность сохранить, а затем вернуться к определенной точке потока контента. Предположим, пользователь смотрит пять минут контента, выходит из видеопотока, а затем возвращается к нему. Создание закладок сохраняет позицию пользователя в потоке, поэтому поток может продолжиться с того места, где он остановился, обеспечивая удобство просмотра для зрителя.

Закладки DAI под капотом

Добавляя в закладки поток DAI, вы должны записать идентификатор потока и время, когда пользователь покидает видео. Когда пользователь вернется, повторно запросите поток и найдите сохраненное время. Поскольку каждый экземпляр запрошенного потока может иметь рекламные паузы разной продолжительности, просто сэкономить время потока не получится. Что вам действительно нужно, так это продолжить с того же времени .

Методы конвертации в помощь

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

Пример приложения

Загрузите образец приложения , чтобы увидеть реализацию закладок.