Pierwsze kroki z pakietem IMA DAI SDK

Wybierz rozwiązanie DAI, które Cię interesuje

DAI z pełną obsługą

Ten przewodnik pokazuje, jak odtwarzać strumień DAI za pomocą pakietu IMA CAF DAI SDK. Jeśli chcesz wyświetlić ukończoną przykładową integrację lub ją kontynuować, pobierz ten przykład.

Przed skorzystaniem z tego przewodnika zapoznaj się z protokołem Chromecast Application Frameworks Web Receiver. Ten przewodnik zakłada znajomość podstawowych zagadnień związanych z odbiornikami CAF, takich jak elementy przechwytujące wiadomości i obiekty mediaInformation, oraz znajomość narzędzi Cast Command and Control do emulowania nadawcy CAF.

Aby korzystać z IMA DAI, musisz mieć konto w usłudze Ad Manager 360. Jeśli masz konto Ad Managera, skontaktuj się z menedżerem konta, aby uzyskać więcej informacji. Więcej informacji o rejestrowaniu się w usłudze Ad Manager znajdziesz w Centrum pomocy tej usługi.

Informacje o integracji z innymi platformami lub o korzystaniu z pakietów SDK IMA po stronie klienta znajdziesz w artykule Pakiety SDK do interaktywnych reklam multimedialnych.

Omówienie funkcji DAI CAF

Implementacja DAI za pomocą pakietu IMA CAF DAI SDK obejmuje 2 główne komponenty, które pokazano w tym przewodniku:

  • StreamRequest: obiekt definiujący żądanie strumienia do serwerów reklamowych Google. Żądania strumieni dzielą się na 2 główne:

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

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

Wymagania wstępne

Konfigurowanie obiektów MediaInfo nadawcy

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

contentId Unikalny identyfikator tego elementu multimedialnego
contentUrl Zastępczy adres URL strumienia, który ma zostać wczytany, gdy z jakiegoś powodu żądanie StreamRequest DAI nie powiedzie się
streamType W przypadku transmisji na żywo ta wartość powinna być ustawiona na „LIVE”. W przypadku transmisji VOD należy ustawić ją na „BUFFERED”.
customData assetKey Tylko transmisje na żywo. Identyfikuje transmisję na żywo, która ma zostać wczytana
contentSourceId Tylko strumienie VOD. Identyfikuje kanał multimediów, który zawiera żądany strumień.
videoId Tylko strumienie VOD. Identyfikuje żądany strumień w podanym kanale multimedialnym.
ApiKey Opcjonalny klucz interfejsu API, który może być wymagany do pobrania adresu URL strumienia z pakietu IMA DAI SDK.
senderCanSkip Wartość logiczna informująca odbiorcę o tym, czy urządzenie wysyłające ma możliwość wyświetlania przycisku pominięcia, co umożliwia obsługę reklam możliwych do pominięcia.

Aby skonfigurować te wartości w narzędziu poleceń i sterowania przesyłaniem, kliknij kartę Load Media (Wczytywanie multimediów) i ustaw niestandardowy typ żądania wczytywania na LOAD. Następnie zastąp dane JSON w obszarze tekstowym 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 niestandardowy obiekt żądania obciążenia może zostać wysłany do odbiorcy w celu przetestowania poniższych kroków.

Tworzenie podstawowego odbiornika CAF

Postępując zgodnie z przewodnikiem po podstawowych odbiornikach SDK CAF, utwórz podstawowy odbiornik internetowy.

Kod Twojego odbiornika 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, by zaimportować pakiet IMA DAI SDK dla CAF do odbiornika internetowego zaraz po wczytaniu skryptu. Pakiet SDK CAF DAI jest zawsze aktualny, więc nie trzeba ustawiać konkretnej wersji. Następnie w poniższym tagu skryptu zapisz kontekst odbiornika i menedżera odtwarzacza jako stałe, zanim uruchomisz odbiornik.

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

Zainicjuj menedżera strumienia pakietu SDK CAF DAI.

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

Utwórz element przechwytujący wiadomości

Pakiet SDK CAF DAI używa przechwytującego komunikatu ładowania CAF do wysyłania żądań strumieni i zastępuje adres URL treści końcowym strumieniem DAI. Funkcja przechwytująca wiadomości wywołuje metodę streamManager.requestStream(), która odpowiada za ustawianie przerw na reklamy, wysyłanie żądań strumienia i zastępowanie istniejących zasobów reklamowych contentURL.

Może być tylko jeden przechwytujący wiadomości, więc jeśli Twoja aplikacja tego wymaga, musisz uwzględnić dowolne 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 zakończyć integrację DAI CAF, musisz utworzyć żądanie strumienia przy użyciu danych zawartych w obiekcie mediaInfo od 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>

Możesz teraz wysyłać żądania strumieni DAI i je odtwarzać za pomocą pakietu Google SDK CAF DAI. Aby dowiedzieć się więcej o bardziej zaawansowanych funkcjach pakietu SDK, zapoznaj się z innymi przewodnikami lub pobierz nasze przykładowe aplikacje odbiorników.