Pierwsze kroki z pakietem IMA DAI SDK

Wybierz interesujące Cię rozwiązanie DAI

Pełna obsługa DAI

Ten przewodnik pokazuje, jak odtwarzać strumień z dynamicznym wstawianiem reklam za pomocą pakietu IMA CAF DAI SDK. Jeśli chcesz wyświetlić lub prześledzić przykładową integrację, pobierz przykład.

Przed skorzystaniem z tego przewodnika zapoznaj się z protokołem Web Receiver w ramach Application Framework Chromecasta. Ten przewodnik zakłada, że znasz podstawowe pojęcia związane z odbiornikami CAF, takie jak przechwytniki wiadomości i obiekty mediaInformation, a także potrafisz używać narzędzia Cast Command and Control do emulowania nadajnika CAF.

Aby korzystać z interfejsu IMA DAI, musisz mieć konto Ad Managera 360. Jeśli masz konto w usłudze Ad Manager, skontaktuj się z menedżerem konta, aby dowiedzieć się więcej. Informacje o rejestracji w usłudze Ad Manager znajdziesz w Centrum pomocy Ad Managera.

Informacje o integracji z innymi platformami lub o korzystaniu z pakietów SDK po stronie klienta IMA znajdziesz w artykule Pakiety SDK Interactive Media Ads.

Omówienie dynamicznego wstawiania reklam w ramach CAF

Wdrażanie DAI za pomocą pakietu IMA CAF DAI SDK obejmuje 2 główne komponenty, jak pokazano w tym przewodniku:

  • StreamRequest: obiekt definiujący żądanie strumienia do serwerów reklamowych Google. Żądania strumieniowania występują w 2 głównych odmianach:

    • LiveStreamRequest: określa klucz zasobu i opcjonalny klucz interfejsu API, a także inne opcjonalne parametry.
    • VODStreamRequest: określa identyfikator źródła treści, identyfikator filmu i opcjonalny klucz API, a także inne opcjonalne parametry.

  • StreamManager: obiekt obsługujący komunikację między strumieniem wideo a pakietem IMA DAI SDK, np. wysyłanie pingów śledzenia i przekazywanie zdarzeń strumienia do wydawcy.

Wymagania wstępne

Konfigurowanie obiektów MediaInfo nadawcy

Najpierw skonfiguruj obiekt MediaInfo aplikacji nadawcy, aby zawierał te pola:

contentId Unikalny identyfikator tego elementu multimedialnego.
contentUrl Adres URL strumienia zastępczego do załadowania, jeśli z jakiegokolwiek powodu nie uda się przetworzyć żądania strumienia DAI.
streamType W przypadku transmisji na żywo ta wartość powinna wynosić „LIVE”. W przypadku transmisji VOD ta wartość powinna wynosić „BUFFERED”.
customData assetKey Tylko transmisje na żywo. Określa transmisję na żywo, która ma zostać załadowana.
contentSourceId Tylko strumienie VOD. Identyfikuje plik danych o multimediach zawierający żądany strumień.
videoId Tylko strumienie VOD. Określa żądany strumień w określonym kanale multimediów.
ApiKey Opcjonalny klucz interfejsu API, który może być wymagany do pobrania adresu URL strumienia z pakietu IMA DAI SDK.
senderCanSkip Wartość logiczna, która informuje odbiorcę, czy urządzenie wysyłające ma możliwość wyświetlania przycisku pomijania, co umożliwia obsługę reklam możliwych do pominięcia.

Aby skonfigurować te wartości w narzędziu do sterowania i zarządzania przesyłaniem, kliknij kartę Wczytaj (Media) i ustaw niestandardowy typ żądania wczytywania na LOAD. Następnie w obszarze tekstowym zastąp dane JSON jednym z tych obiektów JSON:

NA ŻYWO

{
  "media": {
    "contentId": "bbb",
    "contentUrl": "https://storage.googleapis.com/interactive-media-ads/media/bbb.m3u8",
    "streamType": "LIVE",
    "customData": {
      "assetKey": "sN_IYUG8STe1ZzhIIE_ksA",
      "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",
      "ApiKey": "",
      "senderCanSkip": true
    }
  },
  "credentials": "testCredentials"
}

Ten obiekt niestandardowej prośby o załadowanie może zostać wysłany do odbiorcy w celu przetestowania tych czynności.

Tworzenie podstawowego odbiornika CAF

Zgodnie z przewodnikiem dotyczącym podstawowego odbiornika w pakiecie CAF SDK utwórz podstawowego odbiornika internetowego.

Kod odbiorcy powinien wyglądać tak:

<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>

Zaimportuj pakiet IMA DAI SDK i pobierz Menedżera odtwarzaczy

Dodaj tag skryptu, aby zaimportować pakiet IMA DAI SDK for CAF do odbiornika internetowego, zaraz po załadowaniu skryptu CAF. Pakiet SDK CAF DAI jest stale aktualizowany, więc nie trzeba ustawiać konkretnej wersji. Następnie w następnym tagu skryptu przechowuj kontekst odbiornika i menedżera odtwarzania jako stałe przed uruchomieniem odbiornika.

<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>

Inicjowanie Menedżera strumienia IMA

Zainicjuj klasę StreamManager w pakiecie CAF DAI SDK.

<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>

Tworzenie przechwytywania komunikatów ładowania

Pakiet CAF DAI SDK używa przechwytywania wiadomości CAF do wysyłania żądań strumieni i zastępowania adresu URL treści końcowym strumieniem DAI. Przechwytujący wywołuje metodę streamManager.requestStream(), która odpowiada za ustawianie przerw na reklamy, żądanie strumienia i zastępowanie istniejącego contentURL.

Może być tylko 1 przechwytujący komunikat ładowania, więc jeśli Twoja aplikacja wymaga użycia przechwytującego, musisz uwzględnić wszystkie funkcje niestandardowe w tym samym wywołaniu zwrotnym.

<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>

Tworzenie żądania strumienia

Aby dokończyć integrację z CAF DAI, musisz utworzyć żądanie strumienia, używając danych zawartych w obiekcie mediaInfo nadawcy.

<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.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>

Teraz możesz żądać strumieni DAI i odtwarzać je za pomocą pakietu CAF DAI SDK od Google. Aby dowiedzieć się więcej o bardziej zaawansowanych funkcjach pakietu SDK, zapoznaj się z innymi przewodnikami lub pobierz nasze przykładowe aplikacje odbiornika.