Primeiros passos

Pré-requisitos

Para integrar e testar o SDK da PAL para o Cast, você precisa do seguinte:

Como você só precisa atualizar o app receptor para integrar o SDK da PAL, usar a ferramenta Cascata (link em inglês) como remetente da Web para testar o destinatário.

Para executar a amostra ao final de cada etapa, primeiro inicie o ambiente app receptor no CAC e faça uma solicitação de carregamento.

Gerar valor de uso único

Um valor de uso único é uma única string criptografada gerada por PAL por meio da NonceManager A NonceManager é gerado pelo loadNonceManager do método NonceLoader, com base nas configurações transmitidas NonceRequest. Para conferir de exemplo que usa a PAL para gerar um valor de uso único, faça o download do exemplo do Cast GitHub.

Cada nova solicitação de stream requer um novo valor de uso único. Várias solicitações de anúncios no mesmo stream podem usar o mesmo valor de uso único. Para gerar um valor de uso único com o SDK da PAL, primeiro criar um receptor da Web personalizado App e adicione o seguinte código:

receiver.html

<!DOCTYPE html>
<html>
<head>
  <script src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js"></script>
  <script src="//imasdk.googleapis.com/pal/sdkloader/cast_pal.js"></script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <footer>
    <script src="js/receiver.js" type="module"></script>
  </footer>
</body>
</html>

O elemento <cast-media-player> representa a interface do player integrada fornecida pelo a API Cast Web Receiver. Dependendo do tipo de transmissão, o player usado podem variar. Encontre as versões exatas desses players no Google Cast Notas da versão do SDK.

Em seguida, adicione o seguinte código para interceptar LOAD eventos e gerar um valor de uso único sempre que o receptor carregar um novo MediaInformation objeto:

js/receiver.js

const castContext = cast.framework.CastReceiverContext.getInstance();
const playerManager = castContext.getPlayerManager();

const consentSettings = new goog.cast.pal.ConsentSettings();
// For the correct usage of the allowStorage property, See
// developers.google.com/ad-manager/pal/cast/reference/js/ConsentSettings#allowStorage.
consentSettings.allowStorage = true;

// You need a nonce loader to request your stream's nonceManager. The
// nonceManager provides your nonce. You should reuse the same nonce loader for
// the entire lifecycle of the receiver.
const nonceLoader = new goog.cast.pal.NonceLoader(consentSettings);

// You need a reference to the NonceManager to track when an ad is shown or
// clicked.
let nonceManager;

/**
 * Sends a debug message to the CAF sender.
 *
 * @param {String} message - The message to send
 */
const log = (message) => {
  // Use CastDebugLogger to log a message to the sender. See
  // https://developers.google.com/cast/docs/debugging/cast_debug_logger.
}

/**
 * Stores the nonce manager in the outer scoped variable and retrieves a nonce,
 * so it can be used to build your ad request URL
 *
 * @param {NonceManager} loadedNonceManager - The loaded nonce manager
 */
const buildAdRequest = (loadedNonceManager) => {
  nonceManager = loadedNonceManager;

  const nonce = nonceManager.getNonce();
  log('received nonce:' + nonce);

  // TODO: Set this nonce as the value for the `givn` parameter of your ad
  // request URL. For example:
  // const adRequestURL = 'https://myadserver.com/ads?givn=' + nonce;
}

/**
 * Configures a new nonce request, then requests a nonce.
 *
 * @param {LoadRequestData} loadRequestData - the load request object,
 * which contains the MediaInformation object from the sender. See
 * developers.google.com/cast/docs/reference/web_receiver/cast.framework.messages.LoadRequestData
 * @return {(Promise<LoadRequestData>)} - A Promise to build an ad request.
 */
const handleLoadRequest = (loadRequestData) => {
  // Clear any old nonceManager before loading new media.
  nonceManager = null;

  // See developers.google.com/ad-manager/pal/cast/reference/js/NonceRequest
  // for details about each property. The NonceRequest parameters set here are
  // example parameters. You should set your parameters based on your own app
  // characteristics.
  const nonceRequest = new goog.cast.pal.NonceRequest();
  nonceRequest.adWillAutoPlay = true;
  // A URL describing the video stream.
  nonceRequest.descriptionUrl = 'https://example.com';
  nonceRequest.iconsSupported = true;
  nonceRequest.ppid = 'Sample PPID';
  nonceRequest.sessionId = 'Sample SID';
  nonceRequest.url = loadRequestData.media.contentUrl;
  // The height of the player in physical pixels.
  // For a fullscreen player on a 1080p screen, the video height would be 1080.
  nonceRequest.videoHeight = window.devicePixelRatio * window.screen.height;
  // The width of the player in physical pixels.
  // For a fullscreen player on a 1080p screen, the video width would be 1920.
  nonceRequest.videoWidth = window.devicePixelRatio * window.screen.width;

  return nonceLoader.loadNonceManager(nonceRequest)
    .then(buildAdRequest)
    .catch((e) => {
      log("Error: " + e.message);
    });
};

// Set up the event handler for the LOAD event type.
playerManager.setMessageInterceptor(cast.framework.messages.MessageType.LOAD, handleLoadRequest);

castContext.start();

Ao fazer sua chamada VAST direta (DVC), defina esse valor de uso único como o valor no campo parâmetro givn. O valor de uso único é seguro para URL. não é necessário codificar para URL.

Acompanhar interações de vídeo

Além de gerar um valor de uso único, o SDK da PAL precisa ser notificado em determinadas interações de vídeo. Para rastrear interações com o receptor de transmissão, adicione o código a seguir ao seu receptor personalizado:

js/receiver.js

const castContext = cast.framework.CastReceiverContext.getInstance();
const playerManager = castContext.getPlayerManager();

const consentSettings = new goog.cast.pal.ConsentSettings();
// For the correct usage of the allowStorage property, See
// developers.google.com/ad-manager/pal/cast/reference/js/ConsentSettings#allowStorage.
consentSettings.allowStorage = true;

// You need a nonce loader to request your stream's nonceManager. The
// nonceManager provides your nonce. You should reuse the same nonce loader for
// the entire lifecycle of the receiver.
const nonceLoader = new goog.cast.pal.NonceLoader(consentSettings);

// You need a reference to the NonceManager for sending ad events.
let nonceManager;

// Track playback status.
let playbackDidStart = false;

...

// Register the start of playback.
playerManager.addEventListener(cast.framework.events.EventType.PLAYING, () => {
  if (playbackDidStart) return;

  playbackDidStart = true;
  if (nonceManager) {
    log('Registered playback start');
    nonceManager.sendPlaybackStart();
  } else {
    log("Error: There is no nonce manager for this media.");
  }
});

// Register any interactions with the player.
const interactionEvents = [
  cast.framework.events.EventType.REQUEST_SEEK,
  cast.framework.events.EventType.REQUEST_STOP,
  cast.framework.events.EventType.REQUEST_PAUSE,
  cast.framework.events.EventType.REQUEST_PLAY,
  cast.framework.events.EventType.REQUEST_SKIP_AD,
  cast.framework.events.EventType.REQUEST_PLAY_AGAIN,
  cast.framework.events.EventType.REQUEST_PLAYBACK_RATE_CHANGE,
  cast.framework.events.EventType.REQUEST_VOLUME_CHANGE,
  cast.framework.events.EventType.REQUEST_USER_ACTION,
  cast.framework.events.EventType.REQUEST_FOCUS_STATE,
];
playerManager.addEventListener(interactionEvents, (interactionEvent) => {
  if (nonceManager) {
    log('Registered interaction: ' + interactionEvent);
    nonceManager.sendAdTouch(interactionEvent);
  } else {
    log("Error: There is no nonce manager for this media.");
  }
});

// Register the end of playback.
playerManager.addEventListener(cast.framework.events.EventType.MEDIA_FINISHED, () => {
  playbackDidStart = false;
  if (nonceManager) {
    log('Registered playback end');
    nonceManager.sendPlaybackEnd();
  } else {
    log("Error: There is no nonce manager for this media.");
  }
});

castContext.start();

(Opcional) Enviar indicadores do Google Ad Manager por servidores de anúncios de terceiros

Configure a solicitação do servidor de anúncios de terceiros para o Ad Manager. Depois de conclua as etapas a seguir, o parâmetro de valor de uso único será propagado do SDK da PAL, por meio dos servidores intermediários e depois para o Google Ad Manager. Isso permite a monetização com o Google Ad Manager.

Configure seu servidor de anúncios de terceiros para incluir o valor de uso único na variável ao Ad Manager. Veja um exemplo de tag de anúncio configurada dentro do servidor de anúncios de terceiros:

'https://pubads.serverside.net/gampad/ads?givn=%%custom_key_for_google_nonce%%&...'

Para mais detalhes, consulte a Implementação do lado do servidor do Google Ad Manager guia.

O Ad Manager procura por givn= para identificar o valor de uso único. O anúncio de terceiros servidor precisa suportar algumas macros próprias, como %%custom_key_for_google_nonce%% e a substitua pelo parâmetro de consulta de valor de uso único. que você forneceu na etapa anterior. Mais informações sobre como fazer isso deve estar disponível na documentação do servidor de anúncios de terceiros.