Rozpocznij

Wygeneruj nonce

„Nonce” to pojedynczy zaszyfrowany ciąg znaków wygenerowany przez PAL za pomocą NonceLoader. Pakiet SDK PAL wymaga, aby każdemu nowemu żądaniu strumienia towarzyszyła nowo wygenerowana liczba jednorazowa. Jednak wartości nonce mogą być ponownie używane w wielu żądaniach reklamy w ramach tego samego strumienia. Aby zobaczyć przykładową aplikację, która używa PAL do generowania wartości nonce, pobierz przykład HTML5 z GitHub.

Aby wygenerować wartość nonce za pomocą pakietu SDK PAL, utwórz plik HTML i dodaj do niego te informacje:

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>

Następnie utwórz plik JavaScript i dodaj do niego te informacje:

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();

Dołączanie wartości nonce do żądania reklamy

Aby użyć wygenerowanej wartości nonce, przed wysłaniem żądań reklamy dołącz do tagu reklamy parametr givn i wartość nonce.

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);
      })

Jeśli wysyłasz żądania reklam do Google i je renderujesz, musisz renderować ikonę i nakładkę AdChoices. Szczegółowe informacje o analizowaniu odpowiedzi VAST i renderowaniu ikon znajdziesz w sekcji Ikona Informacja i nakładka.

Śledzenie zdarzeń odtwarzania

Na koniec musisz wdrożyć różne procedury obsługi zdarzeń dla odtwarzacza. Na potrzeby testów możesz dołączyć je do zdarzeń kliknięcia przycisku, ale w rzeczywistym wdrożeniu będą one wywoływane przez odpowiednie zdarzenia odtwarzacza:

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();
}

W swojej implementacji wywołuj funkcję sendPlaybackStart po rozpoczęciu sesji odtwarzania filmu. Funkcja sendPlaybackEnd powinna być wywoływana po zakończeniu sesji odtwarzania filmu. sendAdClick należy wywoływać za każdym razem, gdy użytkownik kliknie reklamę. sendAdTouch należy wywoływać przy każdej interakcji dotykowej z odtwarzaczem.

(Opcjonalnie) Wysyłanie sygnałów Google Ad Managera przez serwery reklamowe firm zewnętrznych

Skonfiguruj żądanie serwera reklam innej firmy wysyłane do Ad Managera.

Skonfiguruj serwer reklamowy firmy zewnętrznej tak, aby w żądaniu wysyłanym do Ad Managera uwzględniał wartość nonce. Oto przykład tagu reklamy skonfigurowanego na serwerze reklamowym firmy zewnętrznej:

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

Więcej informacji znajdziesz w przewodniku po implementacji po stronie serwera w Google Ad Managerze.

Ad Manager szuka znaku givn=, aby zidentyfikować wartość nonce. Serwer reklamowy firmy zewnętrznej musi obsługiwać własne makro, np. %%custom_key_for_google_nonce%%, i zastąpić je parametrem zapytania nonce podanym w poprzednim kroku. Więcej informacji o tym, jak to zrobić, znajdziesz w dokumentacji serwera reklam firmy zewnętrznej.

To wszystko. Parametr nonce powinien być teraz przekazywany z pakietu PAL SDK przez serwery pośredniczące do Google Ad Managera. Umożliwia to lepsze zarabianie dzięki Google Ad Managerowi.