Configura el SDK de IMA para la DAI

Selecciona la solución de DAI que te interesa

DAI de servicio completo

En esta guía, se muestra cómo reproducir una transmisión de DAI con el SDK de CAF de IMA para DAI. Si deseas ver o seguir una integración de muestra completada, descarga el ejemplo.

Antes de usar esta guía, asegúrate de familiarizarte con el protocolo del receptor web del framework de aplicaciones de Chromecast. En esta guía, se supone que tienes un nivel básico de familiaridad con los conceptos del receptor de CAF, como los interceptores de mensajes y los objetos mediaInformation, así como con el uso de la herramienta de control y comando de Cast para emular un emisor de CAF.

Para usar la DAI de IMA, debes tener una cuenta de Ad Manager 360. Si tienes una cuenta de Ad Manager, comunícate con tu administrador de cuentas para obtener más detalles. Para obtener información sobre cómo registrarte en Ad Manager, visita el Centro de ayuda de Ad Manager.

Para obtener información sobre la integración con otras plataformas o el uso de los SDKs de IMA del cliente, consulta SDKs de Interactive Media Ads.

Descripción general de la CAF de DAI

La implementación de la DAI con el SDK de CAF de IMA para DAI incluye dos componentes principales, como se muestra en esta guía:

  • StreamRequest: Objeto que define una solicitud de transmisión a los servidores de anuncios de Google. Las solicitudes de transmisión se dividen en dos tipos principales:

    • LiveStreamRequest: Especifica una clave de activo, así como otros parámetros opcionales.
    • VODStreamRequest: Especifica un ID de fuente de contenido, un ID de video y otros parámetros opcionales.
    • Ambos tipos de solicitudes pueden incluir, de forma opcional, una clave de API necesaria para acceder a los flujos especificados y un código de red de Google Ad Manager para que el SDK de IMA controle los identificadores de anuncios según se especifica en la configuración de Google Ad Manager.

  • StreamManager: Es un objeto que controla la comunicación entre la transmisión de video y el SDK de DAI de IMA, como el envío de pings de seguimiento y el reenvío de eventos de transmisión al publicador.

Requisitos previos

  • Una cuenta de Cast Developer Console con un dispositivo de prueba registrado
  • Una app de receptor web alojada que esté registrada en tu Consola para desarrolladores de Cast y que se pueda modificar para alojar el código que proporciona esta guía.
  • Una app de envío configurada para usar tu app de receptor web. En este ejemplo, se usa la herramienta de control y comandos de Cast como dispositivo de envío.

Configura los objetos MediaInfo del remitente

Primero, configura el objeto MediaInfo de tu app del remitente para que incluya los siguientes campos:

contentId Es un identificador único para este elemento multimedia.
contentUrl Es la URL de transmisión de resguardo que se cargará si falla la DAI StreamRequest por algún motivo.
streamType En el caso de las transmisiones en vivo, este valor debe establecerse en "LIVE". En el caso de las transmisiones de VOD, este valor debe establecerse en "BUFFERED".
customData assetKey Solo transmisiones en vivo. Identifica la transmisión en vivo que se cargará
contentSourceId Solo transmisiones de VOD. Identifica el feed de medios que contiene la transmisión solicitada.
videoId Solo transmisiones de VOD. Identifica la transmisión solicitada dentro del feed de medios especificado.
networkCode (Opcional) Tu código de red de Google Ad Manager
ApiKey Es una clave de API opcional que se puede requerir para recuperar la URL de la transmisión del SDK de IMA DAI.
senderCanSkip Es un valor booleano para que el receptor sepa si el dispositivo de envío puede mostrar un botón para omitir, lo que habilita la compatibilidad con anuncios que se pueden omitir.

Para configurar estos valores en la herramienta de control y comandos de transmisión, haz clic en la pestaña Load Media y establece el tipo de solicitud de carga personalizada en LOAD. Luego, reemplaza los datos JSON del área de texto por uno de los siguientes objetos JSON:

EN VIVO

{
  "media": {
    "contentId": "bbb",
    "contentUrl": "https://storage.googleapis.com/interactive-media-ads/media/bbb.m3u8",
    "streamType": "LIVE",
    "customData": {
      "assetKey": "c-rArva4ShKVIAkNfy6HUQ",
      "networkCode": "21775744923",
      "ApiKey": "",
      "senderCanSkip": true
    }
  },
  "credentials": "testCredentials"
}

VOD

{
  "media": {
    "contentId": "tos",
    "contentUrl": "https://storage.googleapis.com/interactive-media-ads/media/tos.m3u8",
    "streamType": "BUFFERED",
    "customData": {
      "contentSourceId": "2548831",
      "videoId": "tears-of-steel",
      "networkCode": "21775744923",
      "ApiKey": "",
      "senderCanSkip": true
    }
  },
  "credentials": "testCredentials"
}

Este objeto de solicitud de carga personalizado se puede enviar al receptor para probar los siguientes pasos.

Crea un receptor de CAF básico

Según la guía de la app receptora básica del SDK de CAF, crea una app receptora web básica.

El código del receptor debería verse de la siguiente manera:

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js">
  </script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    cast.framework.CastReceiverContext.getInstance().start();
  </script>
</body>
</html>

Importa el SDK de IMA DAI y obtén el administrador de reproductores

Agrega una etiqueta de secuencia de comandos para importar el SDK de IMA DAI para CAF a tu receptor web, justo después de que la secuencia de comandos cargue CAF. El SDK de DAI de CAF es permanente, por lo que no es necesario establecer una versión específica. Luego, en la etiqueta de secuencia de comandos que sigue, almacena el contexto del receptor y el administrador del reproductor como constantes antes de iniciar el receptor.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();

    castContext.start();
  </script>
</body>
</html>

Inicializa el IMA Stream Manager

Inicializa el StreamManager del SDK de DAI de CAF.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();
    const streamManager = new google.ima.cast.dai.api.StreamManager();

    castContext.start();
  </script>
</body>
</html>

Crea el interceptor de mensajes de carga

El SDK de CAF DAI usa el interceptador de mensajes de carga de CAF para realizar solicitudes de transmisión y reemplazar la URL del contenido por la transmisión final de DAI. El interceptor de mensajes llama a streamManager.requestStream(), que controla la configuración de las pausas publicitarias, la solicitud de la transmisión y el reemplazo del contentURL existente.

Solo puede haber un interceptor de mensajes de carga, por lo que, si tu app requiere el uso del interceptor, debes incorporar cualquier función personalizada en la misma devolución de llamada.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();
    const streamManager = new google.ima.cast.dai.api.StreamManager();

    const getStreamRequest = (request) => null;

    playerManager.setMessageInterceptor(
        cast.framework.messages.MessageType.LOAD, (request) => {
          return streamManager.requestStream(request, getStreamRequest(request))
              .then((request) => {
                this.broadcast('Stream request successful.');
                return Promise.resolve(request);
              })
              .catch((error) => {
                this.broadcast('Stream request failed.');
                return Promise.resolve(request);
              });
        });

    castContext.start();
  </script>
</body>
</html>

Crea la solicitud de transmisión

Para completar la integración de la DAI de CAF, debes compilar tu solicitud de transmisión con los datos que se incluyeron en el objeto mediaInfo del remitente.

<html>
<head>
  <script type="text/javascript"
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/js/sdkloader/cast_dai.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();
    const streamManager = new google.ima.cast.dai.api.StreamManager();

    const getStreamRequest = (request) => {
      const imaRequestData = request.media.customData;
      let streamRequest = null;
      if (imaRequestData.assetKey) {
        // Live stream
        streamRequest = new google.ima.cast.dai.api.LiveStreamRequest();
        streamRequest.assetKey = imaRequestData.assetKey;
      } else if (imaRequestData.contentSourceId) {
        // VOD stream
        streamRequest = new google.ima.cast.dai.api.VODStreamRequest();
        streamRequest.contentSourceId = imaRequestData.contentSourceId;
        streamRequest.videoId = imaRequestData.videoId;
      }
      if (streamRequest && imaRequestData.networkCode) {
        streamRequest.networkCode = imaRequestData.networkCode;
      }
      if (streamRequest && imaRequestData.ApiKey) {
        streamRequest.ApiKey = imaRequestData.ApiKey;
      }
      if (streamRequest && imaRequestData.senderCanSkip) {
        streamRequest.senderCanSkip = imaRequestData.senderCanSkip;
      }
      return streamRequest;
    };

    playerManager.setMessageInterceptor(
        cast.framework.messages.MessageType.LOAD, (request) => {
          return streamManager.requestStream(request, getStreamRequest(request))
              .then((request) => {
                return Promise.resolve(request);
              })
              .catch((error) => {
                this.broadcast('Stream request failed.');
                return Promise.resolve(request);
              });
        });

    castContext.start();
  </script>
</body>
</html>

Ahora puedes solicitar y reproducir transmisiones de DAI con el SDK de CAF de DAI de Google. Para obtener información sobre las funciones más avanzadas del SDK, consulta las otras guías o descarga nuestras aplicaciones de muestra del receptor.