Ta strona została przetłumaczona przez Cloud Translation API.

Pierwsze kroki

Ten przewodnik pokazuje, jak odtworzyć strumień DAI za pomocą pakietu IMA CAF DAI SDK. Jeśli chcesz zobaczyć przykładową integrację, lub przykład, pobierz przykład.

Zanim zaczniesz korzystać z tego przewodnika, zapoznaj się z protokołem Chromecast Web Framework odbiornika. W tym przewodniku przyjęto podstawowy poziom znajomości pojęć związanych z odbiornikami CAF, takich jak moduły do przechwytywania wiadomości i obiekty mediaInformation, a także umiejętność korzystania z narzędzia Cast Command and Control do emulowania nadawcy CAF.

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

Przegląd DAI CAF

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

StreamRequest: obiekt definiujący żądanie strumienia do serwerów reklam Google. StreamRequests dzielą się na 2 główne warianty:
- LiveStreamRequest: określa klucz zasobu, opcjonalny klucz interfejsu API, a także inne opcjonalne parametry.
- 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. wysyłanie pingów śledzenia i przekazywanie zdarzeń strumienia do wydawcy.

Wymagania wstępne

Zanim zaczniesz, musisz mieć:

Konto Cast Developer Console z zarejestrowanym urządzeniem testowym.
Hostowana aplikacja odbiornika internetowego zarejestrowana w Konsoli programisty Cast, którą można zmodyfikować, aby hostować kod podany w tym przewodniku.
Aplikacja do wysyłania poczty, która została skonfigurowana tak, by korzystała z Twojej aplikacji internetowej. Na potrzeby tego przykładu będziemy używać narzędzia sterowania przesyłaniem.

1. Skonfiguruj obiekty MediaInfo nadawcy

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

identyfikator treści		Unikalny identyfikator tego elementu multimedialnego
contentUrl,		URL strumienia zastępczego, który zostanie załadowany, jeśli z jakiegoś powodu żądanie strumienia DAI nie powiedzie się
streamType,		W przypadku transmisji na żywo ta wartość powinna być ustawiona na „NA ŻYWO”. W przypadku strumieni VOD wartość powinna być ustawiona na „BUFFERED”.
niestandardowedane	assetKey,	Tylko transmisje na żywo. Identyfikuje transmisję na żywo do wczytania
	contentSourceId	Tylko strumienie VOD Identyfikuje kanał mediów zawierający żądany strumień.
	identyfikator filmu	Tylko strumienie VOD Identyfikuje żądany strumień w określonym kanale multimediów.
	Klucz interfejsu API	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, czy urządzenie wysyłające może wyświetlać przycisk pominięcia, co umożliwia obsługę reklam możliwych do pominięcia

Aby skonfigurować te wartości w narzędziu do sterowania przesyłaniem, kliknij kartę „Load Media” (Wczytaj multimedia) i jako niestandardowy typ żądania wczytywania wybierz „LOAD”. Następnie zastąp dane JSON w polu 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": "2528370",
      "videoId": "tears-of-steel",
      "ApiKey": "",
      "senderCanSkip": true
    }
  },
  "credentials": "testCredentials"
}

Obiekt niestandardowego żądania obciążenia można wysłać do odbiornika w celu przetestowania każdego kroku poniżej

2. Tworzenie podstawowego odbiornika CAF

Korzystając z przewodnika CAF SDK Basic odbiornik, utwórz podstawowy odbiornik internetowy.

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>

3. Zaimportuj pakiet IMA DAI SDK i pobierz Menedżera odtwarzaczy

Dodaj tag skryptu, aby zaimportować pakiet IMA DAI SDK do CAF do odbiornika internetowego tuż po wczytaniu skryptu CAF. Pakiet SDK CAF DAI jest zawsze aktualny, więc nie trzeba ustawiać konkretnej wersji. Następnie w poniższym tagu skryptu przechowuj kontekst odbiornika i menedżera odtwarzacza jako stałe przed rozpoczęciem 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>

4. Inicjowanie Menedżera strumienia IMA

Zainicjuj Menedżera strumieni 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>

5. Tworzenie elementu przechwytywania wiadomości wczytywania

Pakiet SDK CAF DAI korzysta z narzędzia do przechwytywania wiadomości CAF do wysyłania żądań strumienia i zastępowania adresu URL treści końcowym strumieniem DAI. Moduł przechwytywania wiadomości wywoła metodę streamManager.requestStream(), która będzie ustawiać przerwy na reklamy, wysyłając żądanie strumienia i zastępując obecny adres URL.

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

6. Tworzenie żądania strumienia

Aby dokończyć integrację CAF DAI, musisz utworzyć żądanie strumienia, wykorzystując dane zawarte w elemencie 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>

... i Gotowe! Teraz możesz wysyłać żądania strumieni DAI i odtwarzać je za pomocą pakietu Google CAF DAI SDK. Aby poznać bardziej zaawansowane funkcje pakietu SDK, przeczytaj inne przewodniki lub pobierz nasze przykładowe aplikacje odbiorników.