Selecione a solução de DAI que você quer usar
DAI de serviço completo
Este guia demonstra como reproduzir um stream de DAI usando o SDK CAF DAI da IMA. Se quiser ver ou acompanhar um exemplo de integração concluída, faça o download do exemplo.
Antes de usar este guia, familiarize-se com o protocolo Web Receiver do Chromecast
Application Framework. Este
guia pressupõe um nível básico de familiaridade com os conceitos do receptor do CAF, como
interceptores de
mensagens
e objetos
mediaInformation
, além de familiaridade com o uso da ferramenta de comando e controle do Cast para emular um remetente do CAF.
Para usar a DAI da IMA, você precisa ter uma conta do Ad Manager 360. Se você tiver uma conta do Ad Manager, entre em contato com seu gerente de contas para mais detalhes. Para saber como se inscrever no Ad Manager, acesse a Central de Ajuda do Ad Manager.
Para informações sobre como fazer a integração com outras plataformas ou usar os SDKs do IMA do lado do cliente, consulte SDKs do Interactive Media Ads.
Visão geral da DAI do CAF
A implementação da DAI usando o SDK CAF DAI do IMA envolve dois componentes principais, conforme demonstrado neste guia:
StreamRequest
: um objeto que define uma solicitação de stream para os servidores de publicidade do Google. Há dois tipos principais de solicitações de transmissão:LiveStreamRequest
: especifica uma chave de recurso, além de outros parâmetros opcionais.VODStreamRequest
: especifica um ID da origem do conteúdo, um ID do vídeo e outros parâmetros opcionais.- Os dois tipos de solicitação podem incluir uma chave de API necessária para acessar fluxos especificados e um código de rede do Google Ad Manager para que o SDK da IMA processe os identificadores de publicidade conforme especificado nas configurações do Google Ad Manager.
StreamManager
: um objeto que processa a comunicação entre o stream de vídeo e o SDK DAI do IMA, como o disparo de pings de rastreamento e o encaminhamento de eventos de stream para o publisher.
Pré-requisitos
- Uma conta do Cast Developer Console com um dispositivo de teste registrado.
- Um aplicativo receptor da Web hospedado registrado no Cast Developer Console e que pode ser modificado para hospedar o código fornecido neste guia.
- Um app remetente configurado para usar seu app receptor da Web. Este exemplo usa a ferramenta de comando e controle do Cast como remetente.
Configurar os objetos MediaInfo do remetente
Primeiro, configure o objeto MediaInfo do app remetente para incluir os seguintes campos:
contentId
|
Um identificador exclusivo do item de mídia. | |
contentUrl
|
O URL do stream substituto a ser carregado se o DAI StreamRequest falhar por qualquer motivo. | |
streamType
|
Para transmissões ao vivo, esse valor precisa ser definido como "LIVE". Para transmissões de VOD, esse valor precisa ser definido como "BUFFERED". | |
customData
|
assetKey
|
Apenas transmissões ao vivo. Identifica a transmissão ao vivo a ser carregada. |
contentSourceId
|
Apenas streams de VOD. Identifica o feed de mídia que contém o stream solicitado. | |
videoId
|
Apenas streams de VOD. Identifica o stream solicitado no feed de mídia especificado. | |
networkCode
|
(Opcional) Seu código de rede do Google Ad Manager. | |
ApiKey
|
Uma chave de API opcional que pode ser necessária para recuperar o URL da transmissão do SDK DAI do IMA. | |
senderCanSkip
|
Um valor booleano para informar ao receptor se o dispositivo de envio tem a capacidade de mostrar um botão "Pular", permitindo o suporte a anúncios puláveis. |
Para configurar esses valores na ferramenta de comando e controle do Cast, clique na guia Carregar mídia e defina o tipo de solicitação de carregamento personalizado como LOAD
. Em seguida, substitua os dados JSON na área de texto por um dos seguintes objetos JSON:
AO 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"
}
Esse objeto de solicitação de carga personalizada pode ser enviado ao receptor para testar as etapas a seguir.
Criar um receptor básico do CAF
Seguindo o guia do receptor básico do SDK do CAF, crie um receptor da Web básico.
O código do receptor vai ficar assim:
<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>
Importar o SDK de DAI do IMA e receber o Player Manager
Adicione uma tag de script para importar o SDK do IMA DAI para CAF ao seu receptor da Web, logo após o script carregar o CAF. O SDK DAI do CAF é permanente, então não é necessário definir uma versão específica. Em seguida, na tag de script a seguir, armazene o contexto do receptor e o gerenciador de player como constantes antes de iniciar o 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>
Inicializar o Stream Manager da IMA
Inicialize o StreamManager do SDK DAI do 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>
Criar o interceptor de mensagens de carga
O SDK DAI do CAF usa o interceptador
de mensagens
de carregamento do CAF para fazer solicitações de stream e substituir o URL do conteúdo pelo stream final da DAI.
O interceptador de mensagens chama streamManager.requestStream(), que processa
a definição de intervalos de anúncio, a solicitação do stream e a substituição do
contentURL
atual.
Só pode haver um interceptador de mensagens de carregamento. Portanto, se o app exigir o uso do interceptador, incorpore todas as funções personalizadas no mesmo callback.
<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>
Criar a solicitação de stream
Para concluir a integração da DAI do CAF, crie sua solicitação de
stream
usando os dados incluídos no objeto mediaInfo
do remetente.
<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>
Agora é possível solicitar e reproduzir streams de DAI com o SDK CAF DAI do Google. Para saber mais sobre recursos avançados do SDK, consulte os outros guias ou faça o download dos nossos aplicativos de exemplo do receptor.