Wybierz rozwiązanie DAI, które Cię interesuje
Kompleksowe funkcje DAI
Ten przewodnik pokazuje, jak odtwarzać strumień z dynamicznym wstawianiem reklam przy użyciu pakietu IMA CAF DAI SDK. Jeśli chcesz zobaczyć ukończoną przykładową integrację lub śledzić jej przebieg, pobierz przykład.
Zanim zaczniesz korzystać z tego przewodnika, zapoznaj się z protokołem odbiornika internetowego Chromecasta Application Framework. Ten przewodnik zakłada podstawowy poziom znajomości pojęć związanych z odbiornikami CAF, takich jak moduły do przechwytywania wiadomości i obiekty mediaInformation
, a także znajomość 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 menedżerem konta, aby uzyskać więcej informacji. Informacje o rejestrowaniu się w usłudze Ad Manager znajdziesz w Centrum pomocy Ad Managera.
Informacje o integracji z innymi platformami i korzystaniu z pakietów SDK IMA po stronie klienta znajdziesz w artykule Pakiety IMA SDK.
Omówienie technologii DAI w technologii CAF
Implementacja DAI za pomocą pakietu IMA CAF DAI obejmuje 2 główne komponenty, jak pokazano w tym przewodniku:
StreamRequest
: obiekt określający żądanie strumienia wysyłane do serwerów reklamowych Google. Żądania strumieni dzielą się na 2 główne rodzaje:LiveStreamRequest
: określa klucz zasobu i opcjonalny klucz interfejsu API oraz inne opcjonalne parametry.VODStreamRequest
: określa identyfikator źródła treści, identyfikator filmu, opcjonalny klucz interfejsu API oraz inne opcjonalne parametry.
StreamManager
: obiekt obsługujący komunikację między strumieniem wideo a pakietem IMA DAI SDK, np. wywoływanie pingów śledzenia i przekazywanie zdarzeń strumienia do wydawcy.
Wymagania wstępne
- Konto w Konsoli programisty obsługującej Cast na zarejestrowanym urządzeniu testowym.
- Hostowaną aplikację odbiornika internetowego zarejestrowaną w Konsoli programisty Cast i którą można zmodyfikować, by hostował kod podany w tym przewodniku.
- Aplikacja wysyłająca skonfigurowana pod kątem korzystania z internetowej aplikacji odbierającej. W tym przykładzie jako nadawca jest używane narzędzie do sterowania przesyłaniem treści.
Skonfiguruj obiekty MediaInfo nadawcy
Najpierw skonfiguruj obiekt MediaInfo aplikacji nadawcy, aby zawierał te pola:
contentId
|
Unikalny identyfikator tego elementu multimedialnego | |
contentUrl
|
URL strumienia zastępczego do wczytania, jeśli z jakiegokolwiek powodu żądanie strumienia z DAI nie powiedzie się | |
streamType
|
W przypadku transmisji na żywo wartość powinna być ustawiona na „NA ŻYWO”. W przypadku transmisji VOD powinna być ustawiona 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 zawierający żądany strumień. | |
videoId
|
Tylko strumienie VOD. Identyfikuje żądany strumień we wskazanym kanale komunikacji. | |
ApiKey
|
Opcjonalny klucz interfejsu API, który może być wymagany do pobierania adresu URL strumienia z pakietu IMA DAI SDK | |
senderCanSkip
|
Wartość logiczna informująca odbiorcy, czy urządzenie wysyłające może wyświetlić 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 (Załaduj multimedia) i ustaw niestandardowy typ żądania wczytywania na LOAD
. Następnie zastąp dane JSON w obszarze tekstowym jednym z tych obiektów JSON:
AKTYWNA
{
"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żna wysłać do odbiorcy w celu przetestowania poniższych kroków.
Tworzenie podstawowego odbiornika CAF
Korzystając z przewodnika dotyczącego podstawowego odbiornika CAF SDK, 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>
Zaimportuj pakiet IMA DAI SDK i pobierz Menedżera odtwarzacza.
Dodaj tag skryptu, aby zaimportować pakiet IMA DAI SDK dla CAF do odbiornika internetowego, tuż za skryptem ładującym CAF. Pakiet CAF DAI SDK jest nieograniczony, więc nie trzeba ustawiać konkretnej wersji. Następnie w tagu skryptu poniżej zapisz kontekst odbiornika i menedżera odtwarzacza w postaci stałych 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 Menedżera strumienia 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 modułu przechwytywania ładowania wiadomości
Pakiet SDK CAF DAI korzysta z modułu przechwytującego komunikaty CAF do wysyłania żądań strumienia i zastępowania adresu URL treści końcowym strumieniem z dynamicznym wstawianiem reklam.
Wywołuje on funkcję streamManager.requestStream(), która obsługuje ustawianie przerw na reklamy, wysyłanie żądań strumienia i zastępowanie istniejących obiektów contentURL
.
Może być tylko jeden moduł do przechwytywania wiadomości, jeśli Twoja aplikacja go wymaga, więc 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 dokończyć integrację DAI w ramach 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 i odtwarzać strumienie z dynamicznym wstawianiem reklam za pomocą pakietu Google CAF DAI SDK. Aby dowiedzieć się więcej o bardziej zaawansowanych funkcjach pakietu SDK, zapoznaj się z innymi przewodnikami lub pobierz nasze przykładowe aplikacje odbierające.