Marcadores de livros

Neste guia, mostramos como implementar a adição de favoritos usando o SDK de DAI do IMA ao usar a Inserção de anúncios dinâmicos (DAI) para streams de vídeo on demand (VOD). Isso pressupõe uma implementação de DAI do IMA, como a apresentada em Primeiras etapas.

O que são favoritos?

Adicionar aos favoritos é a capacidade de salvar e depois voltar a um ponto específico no stream de conteúdo. Suponha que um usuário assista a cinco minutos de conteúdo, saia do stream de vídeo e depois volte a ele. Ao adicionar os favoritos, a posição do usuário no stream é salva para que o stream possa continuar de onde parecia, proporcionando uma experiência perfeita ao espectador.

Criação de favoritos da DAI em segundo plano

Ao adicionar um stream DAI aos favoritos, é necessário registrar o ID do stream e a hora em que o usuário sai do vídeo. Quando o usuário retornar, solicite o stream novamente e procure o horário salvo. Como cada instância do stream solicitado pode ter intervalos de anúncios de durações diferentes, simplesmente economizar tempo de stream não funcionará. O que você realmente quer fazer é continuar a partir do mesmo horário do conteúdo.

Métodos de conversão para o resgate

O SDK de DAI do IMA oferece dois métodos para solicitar o tempo do conteúdo de um determinado tempo de transmissão e o tempo de transmissão de um determinado tempo de conteúdo. Com esses métodos de conversão, é possível armazenar o tempo do conteúdo favorito e, em seguida, procurar o tempo de 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 adição aos favoritos.

Salvando favoritos

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

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

Carregando favoritos

Carregue o favorito ao solicitar um stream novamente.

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 ver uma implementação de adição aos favoritos.