Salvar e carregar favoritos do fluxo de anúncios

Este guia mostra como implementar a inclusão de marcadores usando o SDK da DAI do IMA quando usar a Inserção de anúncios dinâmicos (DAI) para transmissões de vídeo on demand (VOD). Isso pressupõe uma implementação de IMA DAI funcional, como a apresentada em Começar.

O que é adição de marcadores?

A inclusão de favoritos é a capacidade de salvar e retornar a um ponto específico no stream de conteúdo. Digamos que um usuário assista cinco minutos de conteúdo, saia do stream de vídeo e, em seguida, retorne a ele. Com os favoritos, a posição do usuário no stream é salva. Assim o stream pode começar de onde parou, proporcionando uma experiência agradável ao espectador.

Como a inclusão de marcadores de posição da DAI funciona

Ao adicionar uma transmissão do DAI aos favoritos, você precisa registrar o ID e o horário da transmissão quando o usuário sai do vídeo. Quando o usuário retornar, solicite novamente o stream e procure o tempo salvo. Como cada instância do stream solicitado pode ter intervalos de anúncios de diferentes durações, simplesmente salvar o tempo do stream não vai funcionar. O que você realmente quer é continuar com o mesmo tempo de conteúdo.

Métodos de conversão para ajudar

O SDK do IMA DAI oferece um par de métodos para solicitar o tempo de conteúdo para um determinado tempo de transmissão e o tempo de transmissão para um determinado tempo de conteúdo. Com esses métodos de conversão, é possível armazenar o tempo do conteúdo com o marcador e procurar o tempo do stream correspondente na nova instância do stream. Confira a abordagem, incluindo um link para um app de exemplo que mostra uma implementação de favoritos funcional.

Salvar e carregar favoritos do fluxo de anúncios

Salvar um marcador quando o player de conteúdo estiver pausado.

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

Carregando favoritos

Carregar o marcador quando solicitar novamente um stream.

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

App de exemplo

Faça o download do app de exemplo para conferir uma implementação de favoritos.