Salvar e carregar favoritos do fluxo de anúncios

Este guia mostra como implementar a criação de favoritos usando o SDK da 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 funcional da DAI da IMA, como a apresentada em Começar.

O que é adicionar aos favoritos?

A capacidade de salvar e depois voltar 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 funciona a criação de favoritos da DAI

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

Métodos de conversão para ajudar

O SDK de DAI do IMA oferece um par de métodos para solicitar o tempo de conteúdo de um determinado tempo de stream e o tempo de stream de um determinado tempo de conteúdo. Usando esses métodos de conversão, você pode armazenar o tempo de conteúdo marcado com um marcador e, em seguida, buscar 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 favoritos em funcionamento.

Salvar e carregar favoritos de fluxos 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

Carregue o marcador ao solicitar novamente uma transmissão.

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.