Inizia

Genera un nonce

Un "nonce" è una singola stringa criptata generata da PAL utilizzando NonceLoader. L'SDK PAL richiede che ogni nuova richiesta di stream sia accompagnata da un nonce appena generato. Tuttavia, i nonce possono essere riutilizzati per più richieste di annuncio all'interno dello stesso stream. Per visualizzare un'app di esempio che utilizza PAL per generare un nonce, scarica l'esempio HTML5 da GitHub.

Per generare un nonce utilizzando l'SDK PAL, crea un file HTML e aggiungi quanto segue:

pal.html

<html>
<head></head>
<body>
  <div id="placeholder-video"></div>
  <button id="generate-nonce">Generate Nonce</button>
  <script src="//imasdk.googleapis.com/pal/sdkloader/pal.js"></script>
  <script src="pal.js"></script>
</body>
</html>

Quindi, crea un file JavaScript e aggiungi quanto segue:

pal.js

let videoElement;
let nonceLoader;
let managerPromise;
let nonceManager;
let playbackStarted = false;

/**
 * Initializes the PAL loader.
 */
function init() {
  const videoElement = document.getElementById('placeholder-video');
  videoElement.addEventListener('mousedown', (e) => void onVideoTouch(e));
  videoElement.addEventListener('touchstart', (e) => void onVideoTouch(e));
  videoElement.addEventListener('play', () => {
    if (!playbackStarted) {
      sendPlaybackStart();
      playbackStarted = true;
    }
  });
  videoElement.addEventListener('ended', () => void sendPlaybackEnd());
  videoElement.addEventListener('error', () => {
    console.log("Video error: " + videoElement.error.message);
    sendPlaybackEnd();
  });

  document.getElementById('generate-nonce')
      .addEventListener('click', generateNonce);

  // PAL automatically determines whether limited ads apply based on the TCF data
  // found on the page. You can optionally use the `forceLimitedAds` parameter
  // to manually enable limited ads regardless of the TCF data.
  const consentSettings = new goog.pal.ConsentSettings();
  nonceLoader = new goog.pal.NonceLoader(consentSettings);
}

/**
 * Generates a nonce with sample arguments and logs it to the console.
 *
 * The NonceRequest parameters set here are example parameters.
 * You should set your parameters based on your own app characteristics.
 */
function generateNonce() {
  const request = new goog.pal.NonceRequest();
  request.adWillAutoPlay = true;
  request.adWillPlayMuted = false;
  request.continuousPlayback = false;
  request.descriptionUrl = 'https://example.com';
  request.iconsSupported = true;
  request.playerType = 'Sample Player Type';
  request.playerVersion = '1.0';
  request.ppid = 'Sample PPID';
  request.sessionId = 'Sample SID';
  // Player support for VPAID 2.0, OMID 1.0, and SIMID 1.1
  request.supportedApiFrameworks = '2,7,9';
  request.url = 'https://developers.google.com/ad-manager/pal/html5';
  request.videoHeight = 480;
  request.videoWidth = 640;

  managerPromise = nonceLoader.loadNonceManager(request);
  managerPromise
      .then((manager) => {
        nonceManager = manager;
        console.log('Nonce generated: ' + manager.getNonce());
      })
      .catch((error) => {
        console.log('Error generating nonce: ' + error);
      });
}

init();

Allega il nonce alla richiesta di annuncio

Per utilizzare il nonce generato, aggiungi il parametro givn e il valore nonce al tag annuncio prima di effettuare le richieste di annuncio.

pal.js

  /**
   * The ad tag for your ad request, for example:
   * https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=
   *
   * For more sample ad tags, see https://developers.google.com/interactive-media-ads/docs/sdks/html5/client-side/tags
   */
  const DEFAULT_AD_TAG = "Your ad tag";

  ...

  managerPromise = nonceLoader.loadNonceManager(request);
  managerPromise
      .then((manager) => {
        nonceManager = manager;
        console.log('Nonce generated: ' + manager.getNonce());
        
        // Append the nonce to the ad tag URL.
        makeAdRequest(DEFAULT_AD_TAG + "&givn=" + nonceString);
      })

Se richiedi e visualizzi annunci di Google, devi visualizzare l'icona e l'overlay AdChoices. Per informazioni dettagliate sull'analisi della risposta VAST e sul rendering delle icone, consulta Icona e overlay Scegli Tu!.

Monitorare gli eventi di riproduzione

Infine, devi implementare vari gestori di eventi per il tuo player. A scopo di test, puoi allegarli agli eventi di clic sui pulsanti, ma in un'implementazione reale, questi verrebbero attivati dagli eventi del player appropriati:

pal.js

/**
 * Informs PAL that an ad click has occurred. How this function is
 * called will vary depending on your ad implementation.
 */
function sendAdClick() {
  nonceManager?.sendAdClick();
}

/**
 * Handles the user touching on the video element, passing it to PAL.
 * @param {!TouchEvent|!MouseEvent} touchEvent
 */
function onVideoTouch(touchEvent) {
  nonceManager?.sendAdTouch(touchEvent);
}

/** Informs PAL that playback has started. */
function sendPlaybackStart() {
  nonceManager?.sendPlaybackStart();
}

/** Informs PAL that playback has ended. */
function sendPlaybackEnd() {
  nonceManager?.sendPlaybackEnd();
}

Nell'implementazione, sendPlaybackStart deve essere chiamato all'inizio della sessione di riproduzione video. sendPlaybackEnd deve essere chiamato al termine della sessione di riproduzione video. sendAdClick deve essere chiamato ogni volta che lo spettatore fa clic su un annuncio. sendAdTouch deve essere chiamato a ogni interazione touch con il player.

(Facoltativo) Inviare indicatori di Google Ad Manager tramite ad server di terze parti

Configura la richiesta del server pubblicitario di terze parti per Ad Manager.

Configura l'ad server di terze parti in modo che includa il nonce nella richiesta del server ad Ad Manager. Ecco un esempio di tag annuncio configurato all'interno dell'ad server di terze parti:

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

Per maggiori dettagli, consulta la guida all'implementazione lato server di Google Ad Manager.

Ad Manager cerca givn= per identificare il valore nonce. L'ad server di terze parti deve supportare una macro propria, ad esempio %%custom_key_for_google_nonce%%, e sostituirla con il parametro di query nonce che hai fornito nel passaggio precedente. Maggiori informazioni su come eseguire questa operazione dovrebbero essere disponibili nella documentazione del server pubblicitario di terze parti.

È tutto. Ora dovresti aver propagato il parametro nonce dall'SDK PAL, tramite i server intermediari, fino a Google Ad Manager. Ciò consente una migliore monetizzazione tramite Google Ad Manager.