Premiers pas avec le SDK IMA DAI

Sélectionnez la solution d'insertion dynamique d'annonce qui vous intéresse

Insertion dynamique de séries d'annonces

Les SDK IMA simplifient l'intégration d'annonces multimédias dans vos sites Web et applications.

Les SDK IMA peuvent demander des annonces Compatible avec la norme VAST l'ad server et gérer la lecture des annonces dans vos applications.

Avec les SDK IMA DAI, les applications envoient une demande de flux pour des annonces et des contenus vidéo pour en VOD ou en direct. Le SDK renvoie ensuite un flux vidéo combiné, vous n'avez pas besoin de gérer le basculement entre les annonces et les vidéos de contenu dans votre l'application.

Ce guide explique comment diffuser un flux utilisant l'insertion dynamique de séries d'annonces en direct à l'aide de l'IMA SDK d'insertion dynamique d'annonces pour CAF.

Avant d'utiliser ce guide, familiarisez-vous avec les Récepteur Web du framework d'application Chromecast standard. Ce guide suppose une compréhension de base des concepts de récepteur CAF, tels que intercepteurs de messages et mediaInformation des objets et une bonne connaissance de l'utilisation Outil de commande et de contrôle Cast, pour émuler un expéditeur CAF.

Pour utiliser la diffusion de séries d'annonces IMA DAI, vous devez collaborer avec un partenaire de diffusion de séries doit avoir un Ad Manager 360 Advanced Google Cloud. Si vous possédez un compte Ad Manager, contactez votre responsable de compte pour plus de détails. Pour en savoir plus sur l'inscription à Ad Manager, consultez le Centre d'aide Ad Manager.

Pour en savoir plus sur l'intégration à d'autres plates-formes ou sur l'utilisation du SDK IMA pour les SDK côté client, consultez la page SDK Interactive Media Ads.

Présentation de l'insertion dynamique de séries d'annonces d'IMA

L'implémentation de la diffusion de séries d'annonces à l'aide du SDK IMA CAF DAI implique deux composants principaux : qui sont illustrés dans ce guide:

• StreamRequest: Objet qui définit une demande de flux envoyée aux serveurs publicitaires de Google. Les requêtes spécifient un code de réseau, une clé d'élément personnalisée et une clé API facultative. ainsi que d'autres paramètres facultatifs.
• StreamManager: Un objet qui gère la communication entre le flux vidéo et l'IMA DAI SDK, comme le déclenchement de pings de suivi et le transfert d'événements de flux à un éditeur.

Prérequis

• Un compte Console de développement Cast avec appareils de test enregistrés.
• Un récepteur Web hébergé application qui est enregistré dans votre console de développement Cast et qui peut être modifié pour héberger à l'aide du code fourni dans ce guide.
• Une application d'envoi configurée pour utiliser votre application réceptrice Web. Pour le Pour les besoins de cet exemple, utilisez la commande Cast comme expéditeur.

Configurer les objets MediaInfo de l'expéditeur

Commencez par configurer Objet MediaInfo pour inclure les champs suivants:

Voici quelques exemples de code pour vous aider à démarrer:

// 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"
    }
  }
}

Cette demande de chargement personnalisé peut être envoyée au récepteur pour tester le reste des étapes.

Créer un récepteur CAF de base

Créer un récepteur Web personnalisé, comme illustré dans le récepteur Web personnalisé du SDK CAF Guide de démarrage.

Le code du récepteur devrait se présenter comme suit:

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

Importer le SDK IMA DAI et télécharger le Gestionnaire de lecteurs

Ajoutez un tag de script pour importer le SDK IMA DAI pour CAF dans votre récepteur Web. Il vous suffit pour cela après le chargement du script CAF. Dans le tag de script, stockez le contexte du récepteur et le gestionnaire de joueurs comme constantes avant de démarrer le récepteur.

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

Initialiser le gestionnaire de flux IMA

Initialisez le gestionnaire de flux IMA.

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

Créer l'intercepteur de charge du gestionnaire de flux

Avant que vos éléments multimédias ne soient transmis au CAF, créez votre demande de flux dans un CHARGER le message intercepteur.

    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();

Créer la demande de flux

Exécutez la fonction createStreamRequest pour créer un flux de diffusion de pods basé sur sur la requête de chargement CAF.

    /**
     * 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;
    };

Remplacer l'URL de contenu par l'URL du fichier manifeste et l'ID de flux

Si votre demande de flux aboutit, utilisez streamManager.getStreamId() pour récupérez l'ID du flux et insérez-le dans votre manifestUrl, en remplaçant [[STREAMID]] Remplacez ensuite l'contentUrl existante par la nouvelle manifestUrl pour que CAF lance la diffusion en direct avec les séries d'annonces assemblées.

    /**
     * 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;
          });
    };

Vous pouvez désormais demander et lire des flux de diffusion de pods avec l'application Cast et le SDK IMA DAI pour CAF.