Einführung in das IMA DAI SDK

Gewünschte Lösung für die dynamische Anzeigenbereitstellung auswählen

Dynamische Anzeigenbereitstellung für die Pod-Auslieferung

IMA SDKs vereinfachen die Integration von Multimedia-Anzeigen in Ihre Websites und Apps.

IMA SDKs können Anzeigen von beliebigen VAST-kompatibel Ad-Server einrichten und die Anzeigenwiedergabe in Ihren Apps verwalten.

Mit IMA SDKs für die dynamische Anzeigenbereitstellung können Apps Streamanfragen für Anzeigen und Videos für als On-Demand-Videos oder Liveinhalte. Das SDK gibt dann einen kombinierten Videostream zurück, dass Sie den Wechsel zwischen Anzeigen und Content-Videos nicht in Ihrem

In dieser Anleitung wird gezeigt, wie Sie mithilfe des IMA ein Stream für die Pod-Auslieferung mit der dynamischen Anzeigenbereitstellung wiedergeben. DAI SDK für CAF.

Bevor Sie diesen Leitfaden verwenden, machen Sie sich mit der Webempfänger des Chromecast Application Framework Protokoll. In diesem Leitfaden werden grundlegende Kenntnisse über CAF-Empfängerkonzepte, zum Beispiel Nachrichtenabfanger und mediaInformation Objekte und die Vertrautheit mit der Cast-Befehl und -Steuerung, um einen CAF-Sender zu emulieren.

Wenn Sie die Pod-Auslieferung mit der dynamischen Anzeigenbereitstellung von IMA verwenden möchten, müssen Sie mit einem Partner für die Pod-Auslieferung zusammenarbeiten und muss eine Ad Manager 360 für Fortgeschrittene Konto. Wenn Sie ein Ad Manager-Konto haben, wenden Sie sich an Ihren Account Manager für erhalten Sie weitere Informationen. Informationen zur Registrierung für Ad Manager finden Sie in der Ad Manager-Hilfe.

Informationen zur Integration mit anderen Plattformen oder zur Verwendung des IMA clientseitige SDKs siehe Interactive Media Ads SDKs.

Pod-Auslieferung mit der dynamischen Anzeigenbereitstellung von IMA – Übersicht

Die Implementierung der Pod-Auslieferung mit dem IMA CAF DAI SDK umfasst zwei Hauptkomponenten: die in diesem Leitfaden erläutert werden:

• StreamRequest: Ein Objekt, das eine Streamanfrage an die Werbeserver von Google definiert. Anfragen geben einen Netzwerkcode, einen benutzerdefinierten Asset-Schlüssel und einen optionalen API-Schlüssel an, sowie weitere optionale Parameter.
• StreamManager: Ein Objekt, das die Kommunikation zwischen dem Videostream und der dynamischen Anzeigenbereitstellung mit IMA SDK steuert SDK, um beispielsweise Tracking-Pings auszulösen und Streamereignisse an den Publisher.

Vorbereitung

• Ein Konto für die Cast Developer Console mit registrierte Testgeräte.
• Gehosteter Webempfänger App, die die in Ihrer Cast Developer Console registriert sind und geändert werden können, Code aus diesem Leitfaden.
• Eine sendende App, die für die Verwendung Ihrer Webempfänger-App konfiguriert ist. Für die Verwenden Sie in diesem Beispiel den Befehl Cast Tool als Absender festlegen.

MediaInfo-Objekte des Absenders konfigurieren

Konfigurieren Sie zunächst die MediaInfo-Objekt um die folgenden Felder aufzunehmen:

Hier sind einige Codebeispiele, die Ihnen den Einstieg erleichtern:

// Create mediaInfo object
const mediaInfo = new chrome.cast.media.MediaInfo("CONTENT_ID");
mediaInfo.contentUrl = "BACKUP_STREAM_URL";
mediaInfo.contentType = "CONTENT_STREAM_MIMETYPE";
mediaInfo.streamType = chrome.cast.media.StreamType.LIVE;
mediaInfo.customData = {
manifestUrl: "MANIFEST_URL",
networkCode: "NETWORK-CODE",
customAssetKey: "CUSTOM_ASSET_KEY",
apiKey: "API_KEY"
};

// Make load request to cast web receiver
const castSession = cast.framework.CastContext.getInstance().getCurrentSession();
const request = new chrome.cast.media.LoadRequest(mediaInfo);
castSession.loadMedia(request).then(
  () => { console.log('Load succeed'); },
  (errorCode) => { console.log('Error code: ' + errorCode); });

JSONObject customData = new JSONObject()?
  .put("manifestUrl", "MANIFEST_URL")
  .put("networkCode", "NETWORK-CODE")
  .put("customAssetKey", "CUSTOM_ASSET_KEY")
  .put("apiKey", "API_KEY");
MediaInfo mediaInfo = MediaInfo.Builder("CONTENT_ID")
  .setContentUrl("BACKUP_STREAM_URL")
  .setContentType("CONTENT_STREAM_MIMETYPE")
  .setStreamType(MediaInfo.STREAM_TYPE_LIVE)
  .setCustomData(customData)
  .build();

RemoteMediaClient remoteMediaClient = mCastSession.getRemoteMediaClient();
remoteMediaClient.load(new MediaLoadRequestData.Builder().setMediaInfo(mediaInfo).build());

NSURL url = [NSURL URLWithString:@"BACKUP_STREAM_URL"];
NSDictionary *customData = @{
  @"manifestUrl": @"MANIFEST_URL",
  @"networkCode": @"NETWORK-CODE",
  @"customAssetKey": @"CUSTOM_ASSET_KEY",
  @"apiKey": @"API_KEY"};
mediaInfoBuilder.customData = customData;

GCKMediaInformationBuilder *mediaInfoBuilder =
  [[GCKMediaInformationBuilder alloc] initWithContentID: @"CONTENT_ID"];
mediaInfoBuilder.contentURL = url;
mediaInfoBuilder.contentType = @"CONTENT_STREAM_MIMETYPE";
mediaInfoBuilder.streamType = GCKMediaStreamTypeLive;
mediaInfoBuilder.customData = customData;
self.mediaInformation = [mediaInfoBuilder build];

GCKRequest *request = [self.sessionManager.currentSession.remoteMediaClient loadMedia:self.mediaInformation];
if (request != nil) {
  request.delegate = self;
}

let url = URL.init(string: "BACKUP_STREAM_URL")
guard let mediaURL = url else {
  print("invalid mediaURL")
  return
}

let customData = [
  "liveConfigID": "MANIFEST_URL",
  "networkCode": "NETWORK-CODE",
  "customAssetKey": "CUSTOM_ASSET_KEY",
  "region": "API_KEY"
]

let mediaInfoBuilder = GCKMediaInformationBuilder.init(contentId: "CONTENT_ID")
mediaInfoBuilder.contentURL = mediaUrl
mediaInfoBuilder.contentType = @"CONTENT_STREAM_MIMETYPE"
mediaInfoBuilder.streamType = GCKMediaStreamType.Live
mediaInfoBuilder.customData = customData
mediaInformation = mediaInfoBuilder.build()

guard let mediaInfo = mediaInformation else {
  print("invalid mediaInformation")
  return
}

if let request = sessionManager.currentSession?.remoteMediaClient?.loadMedia
(mediaInfo) {
  request.delegate = self
}

{
  "media": {
    "contentId": "CONTENT_ID",
    "contentUrl": "BACKUP_STREAM_URL",
    "contentType": ""CONTENT_STREAM_MIMETYPE"",
    "streamType": "LIVE",
    "customData": {
      "liveConfigID": "MANIFEST_URL",
      "networkCode": "NETWORK-CODE",
      "customAssetKey": "CUSTOM_ASSET_KEY",
      "oAuthToken": "API_KEY"
    }
  }
}

Diese benutzerdefinierte Ladeanfrage kann an den Empfänger gesendet werden, um den Rest des Schritte.

Einfachen CAF-Empfänger erstellen

Benutzerdefinierten Web Receiver erstellen (siehe Abschnitt Custom Web Receiver des CAF SDK) Leitfaden.

Der Code des Empfängers sollte wie folgt aussehen:

<html>
<head>
  <script
      src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js">
  </script>
</head>
<body>
  <cast-media-player></cast-media-player>
  <script>
    // ...
  </script>
</body>
</html>

IMA DAI SDK importieren und Player-Manager abrufen

Fügen Sie ein Skript-Tag hinzu, um das IMA DAI SDK für CAF in Ihren Webempfänger zu importieren. nachdem das CAF-Skript vom Script geladen wurde. Speichern Sie im Skript-Tag den Empfängerkontext und Player-Manager als Konstanten festlegen, bevor der Receiver gestartet wird.

<html>
<head>
  <script
      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>

IMA Stream Manager initialisieren

Initialisieren Sie den IMA Stream Manager.

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

Stream Manager-Load-Interceptor erstellen

Bevor Ihre Medienelemente an CAF übergeben werden, müssen Sie Ihre Streamanfrage in einem Nachricht laden Interceptor.

    const castContext = cast.framework.CastReceiverContext.getInstance();
    const playerManager = castContext.getPlayerManager();
    const streamManager = new google.ima.cast.dai.api.StreamManager();

    /**
     * Creates a livestream request object for a pod serving stream.
     * @param {!LoadRequestData} castRequest The request object from the cast sender
     * @return {StreamRequest} an IMA stream request
     */
    const createStreamRequest = (castRequest) => { /* ... */};

    /**
     * Initates a DAI stream request for the final stream manifest.
     * @param {!LoadRequestData} castRequest The request object from the cast sender
     * @return {Promise<LoadRequestData>} a promise that resolves to an updated castRequest, containing the DAI stream manifest
     */
    const createDAICastRequest = (castRequest) => {
        return streamManager.requestStream(castRequest, createStreamRequest(castRequest))
          .then((castRequestWithPodStreamData) => {
            console.log('Successfully made DAI stream request.');
            // ...
            return castRequestWithPodStreamData;
          })
          .catch((error) => {
            console.log('Failed to make DAI stream request.');
            // CAF will automatically fallback to the content URL
            // that it can read from the castRequest object.
            return castRequest;
          });
    };

    playerManager.setMessageInterceptor(
        cast.framework.messages.MessageType.LOAD, createDAICastRequest);

    castContext.start();

Streamanfrage erstellen

Führen Sie die Funktion createStreamRequest aus, um einen Pod-Auslieferungsstream zu erstellen. in der CAF-Ladeanfrage.

    /**
     * Creates a livestream request object for a pod serving stream.
     * @param {!LoadRequestData} castRequest The request object from the cast sender
     * @return {StreamRequest} an IMA stream request
     */
    const createStreamRequest = (castRequest) => {

      const streamRequest = new google.ima.cast.dai.api.PodStreamRequest();
      const customData = castRequest.media.customData;

      streamRequest.customAssetKey = customData.customAssetKey;
      streamRequest.networkCode = customData.networkCode;
      streamRequest.apiKey = customData.apiKey;

      return streamRequest;
    };

Ersetzen Sie die Content-URL durch die Manifest-URL und die Stream-ID.

Wenn deine Streamanfrage erfolgreich war, verwende streamManager.getStreamId(), um die Stream-ID abrufen und in die "manifestUrl" einfügen. Ersetzen Sie dabei [[STREAMID]]. Ersetzen Sie dann das vorhandene Feld „contentUrl“ durch das neue manifestUrl, damit CAF den Livestream mit den zusammengefügten Anzeigen-Pods wiedergibt.

    /**
     * Initates a DAI stream request for the final stream manifest.
     * @param {!LoadRequestData} castRequest The request object from the cast sender
     * @return {Promise<LoadRequestData>} a promise that resolves to an updated castRequest, containing the DAI stream manifest
     */
    const createDAICastRequest = (castRequest) => {
        return streamManager.requestStream(castRequest, createStreamRequest(castRequest))
          .then((castRequestWithPodStreamData) => {
            console.log('Successfully made DAI stream request.');
            const media = castRequestWithPodStreamData.media;
                const manifestUrl = media.customData.manifestUrl || "";
                if (manifestUrl) {
                    console.log('Replacing the contentURL with the manifest URL and stream ID');
                    const streamId = streamManager.getStreamId();
                    castRequestWithPodStreamData.media.contentUrl = manifestUrl.replace('[[STREAMID]]', streamId);

            return castRequestWithPodStreamData;
          })
          .catch((error) => {
            console.log('Failed to make DAI stream request.');
            // CAF will automatically fallback to the content URL
            // that it can read from the castRequest object.
            return castRequest;
          });
    };

Mit der Cast App können Sie jetzt Pod-Bereitstellungs-Streams anfordern und wiedergeben und das IMA DAI SDK für CAF verwenden.