תחילת העבודה עם IMA DAI SDK

איך בוחרים את פתרון DAI שמעניין אתכם

הטמעת מודעות דינמיות (DAI) ב-Pod

ערכות IMA SDK מפשטות את השילוב של מודעות מולטימדיה באתרים ובאפליקציות.

ערכות IMA SDK יכולות לבקש מודעות מכל שרת מודעות שתואם ל-VAST, ולנהל את הפעלת המודעות באפליקציות שלכם.

בעזרת ערכות IMA DAI SDK, האפליקציות שולחות בקשה לסטרימינג של מודעה ושל תוכן וידאו בשביל תוכן VOD או תוכן בשידור חי. לאחר מכן ה-SDK מחזירה שידור וידאו משולב, כך שלא תצטרכו לנהל את המעבר בין מודעות וידאו בתוכן באפליקציה.

המדריך הזה מדגים איך להפעיל שידור חי של הצגת Pod של DAI ב-DAI באמצעות IMADAI SDK ל-CAF.

לפני שתשתמשו במדריך הזה, כדאי שתכירו את פרוטוקול האינטרנט מקלט אינטרנט של Chromecast Application Framework. במדריך הזה מבוססת על הבנה בסיסית של המושגים של מקלטי CAF, כמו מיירטים של הודעות ואובייקטי mediaInformation, והיכרות עם השימוש בכלי Cast Command and Control, כדי לחקות שולח CAF.

כדי להשתמש בהצגת Pod של IMA DAI, אתם צריכים לעבוד עם שותף להצגת Pod, וצריכים להיות לכם חשבון Ad Manager 360 Advanced. אם יש לכם חשבון Ad Manager, תוכלו לפנות למנהל החשבון שלכם לקבלת פרטים נוספים. מידע על ההרשמה ל-Ad Manager זמין במרכז העזרה של Ad Manager.

למידע נוסף על השילוב עם פלטפורמות אחרות או על השימוש בערכות ה-SDK בצד הלקוח של IMA, ראו ערכות SDK של מודעות מדיה אינטראקטיביות.

סקירה כללית בנושא הצגת מודעות Pod של IMA DAI

כדי להטמיע הצגת Pod באמצעות IMA CAF DAI SDK יש שני רכיבים עיקריים, שמודגמים במדריך הזה:

• StreamRequest: אובייקט שמגדיר בקשה של מקור נתונים לשרתי הפרסום של Google. הבקשות כוללות קוד רשת, מפתח נכס מותאם אישית ומפתח API אופציונלי, וגם פרמטרים אופציונליים אחרים.
• StreamManager: אובייקט שמטפל בתקשורת בין שידור הווידאו לבין ה-SDK של IMA DAI, למשל הפעלה של פינגים למעקב והעברת אירועי סטרימינג אל בעל התוכן הדיגיטלי.

דרישות מוקדמות

• חשבון Cast Developer Console עם מכשירי בדיקה רשומים.
• אפליקציה מתארחת של קבלה שרשומה ב-Cast Console, ואפשר לשנות אותה כך שיארח את הקוד שמופיע במדריך הזה.
• אפליקציית שליחה שמוגדרת לשימוש באפליקציית האינטרנט של המקבל. למטרות הדוגמה הזו, צריך להשתמש בכלי Command and Control של הפעלת Cast בתור השולח.

הגדרת האובייקטים MediaInfo של השולח

תחילה צריך להגדיר את האובייקט MediaInfo של אפליקציית השולח כך שיכלול את השדות הבאים:

הנה כמה דוגמאות קוד שיעזרו לכם להתחיל:

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

אפשר לשלוח את בקשת הטעינה המותאמת אישית למקבל כדי לבדוק את שאר השלבים.

יצירת מקלט CAF בסיסי

יוצרים מקלט אינטרנט מותאם אישית, כפי שמופיע במדריך למקלט אינטרנט מותאם אישית של CAF SDK.

הקוד של המקבל אמור להיראות כך:

<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 ומקבלים את Player Manager

מוסיפים תג סקריפט כדי לייבא את IMA DAI SDK ל-CAF למקלט האינטרנט, מיד לאחר שהסקריפט נטען ב-CAF. בתג הסקריפט, מאחסנים את ההקשר של המקבל ואת מנהל הנגן כקבועים לפני שמפעילים את המקבל.

<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

הפעלת 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>

יצירת יירוט העומס של מנהל השידורים

לפני שפריטי המדיה מועברים ל-CAF, צריך ליצור את הבקשה לשידור במיירט הודעות של LOAD.

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

יצירת הבקשה לשידור

משלימים את הפונקציה createStreamRequest כדי ליצור שידור Pod להצגת מודעות שמבוסס על בקשת העומס ב-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;
    };

צריך להחליף את כתובת ה-URL של התוכן בכתובת ה-URL של המניפסט ובמזהה מקור הנתונים.

אם הבקשה לשידור תאושר, צריך להשתמש ב-streamManager.getStreamId() כדי לאחזר את המזהה של מקור הנתונים ולהוסיף אותו לקובץ המניפסטUrl, ולהחליף את [[STREAMID]]. לאחר מכן, מחליפים את contentUrl הקיים ב-manifestUrl החדש, כדי ש-CAF יפעיל את השידור החי עם רצף המודעות המחובר.

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

עכשיו אפשר לבקש ולהפעיל שידורים של רצפי מודעות באמצעות מסגרת האפליקציה Cast ו-IMA DAI SDK ל-CAF.