ساختن کلاس مدیر آگهی

توجه: قبل‌از ادامه دادن با این راهنما، باید مراحل راه‌اندازی کلاس پخش‌کننده را تکمیل کنید.

در ads_manager.js، یک کلاس پوشاننده برای IMA SDK StreamManager تعریف کنید که درخواست‌های جاری‌سازی را انجام می‌دهد، مانیفست دسته آگهی را دریافت می‌کند، به رویدادهای جاری‌سازی IMA گوش می‌دهد، و رویدادهای emsg را به IMA SDK منتقل می‌کند.

در ads_manager.js، برنامه نمونه IMA HbbTV روش‌های زیر را راه‌اندازی می‌کند:

• requestStream()
• onStreamEvent()
• onEmsgEvent()
• loadAdPodManifest()

راه‌اندازی مدیر آگهی‌ها

کلاس مدیر آگهی‌ها را مقداردهی اولیه کنید و شنوندگان را برای رویدادهای جاری‌سازی IMA تنظیم کنید. در این فراخوانی، گرداننده رویداد emsg را با روش VideoPlayer.setEmsgEventHandler() تنظیم کنید.

نکته کلیدی: کیت توسعه نرم‌افزار IMA SDK از واسط کاربر آگهی در HbbTV پشتیبانی نمی‌کند. پارامتر adUiElement را در سازنده StreamManager ارسال نکنید. ارسال adUiElement می‌تواند باعث شود Ad Manager آگهی‌های ناسازگار ارائه دهد.

/**
 * Wraps IMA SDK ad stream manager.
 * @param {!VideoPlayer} videoPlayer Reference an instance of the wrapper from
 * video_player.js.
 */
var AdManager = function(videoPlayer) {
  this.streamData = null;
  this.videoPlayer = videoPlayer;
  // Ad UI is not supported for HBBTV, so no 'adUiElement' is passed in the
  // StreamManager constructor.
  this.streamManager = new google.ima.dai.api.StreamManager(
      this.videoPlayer.videoElement);
  this.streamManager.addEventListener(
      [
        google.ima.dai.api.StreamEvent.Type.STREAM_INITIALIZED,
        google.ima.dai.api.StreamEvent.Type.ERROR,
        google.ima.dai.api.StreamEvent.Type.CLICK,
        google.ima.dai.api.StreamEvent.Type.STARTED,
        google.ima.dai.api.StreamEvent.Type.FIRST_QUARTILE,
        google.ima.dai.api.StreamEvent.Type.MIDPOINT,
        google.ima.dai.api.StreamEvent.Type.THIRD_QUARTILE,
        google.ima.dai.api.StreamEvent.Type.COMPLETE,
        google.ima.dai.api.StreamEvent.Type.AD_BREAK_STARTED,
        google.ima.dai.api.StreamEvent.Type.AD_BREAK_ENDED,
        google.ima.dai.api.StreamEvent.Type.AD_PROGRESS,
        google.ima.dai.api.StreamEvent.Type.PAUSED,
        google.ima.dai.api.StreamEvent.Type.RESUMED
      ],
      this.onStreamEvent.bind(this),
      false);

  this.videoPlayer.setEmsgEventHandler(this.onEmsgEvent, this);
};
ads_manager.js

درخواست برای جاری‌سازی دسته آگهی ایجاد کنید

روش AdManager.requestStream() را برای ایجاد شیء PodStreamRequest بااستفاده از کد شبکه Google Ad Manager و کلید دارایی سفارشی جاری‌سازی ایجاد کنید. برنامه HbbTV خود را بااستفاده از جاری‌سازی ارائه‌دهنده دسته آگهی DASH نمونه IMA با پارامترهای جاری‌سازی زیر آزمایش کنید:

• کد شبکه: '21775744923'
• کلید دارایی سفارشی: 'hbbtv-dash'

/**
 * Makes a pod stream request.
 * @param {string} networkCode The network code.
 * @param {string} customAssetKey The custom asset key.
 */
AdManager.prototype.requestStream = function (networkCode, customAssetKey) {
  var streamRequest = new google.ima.dai.api.PodStreamRequest();
  var secretKey = getStreamSecretKeys();

  streamRequest.networkCode = networkCode;
  streamRequest.customAssetKey = customAssetKey;
  streamRequest.format = 'dash';

  if (secretKey.STREAM_CREATE_SECRET) {
    var expirationTime = Math.trunc(new Date().getTime() / 1000) + 3600;
    var params = {
      custom_asset_key: customAssetKey,
      exp: expirationTime,
      network_code: networkCode
    };
    streamRequest.authToken =
        this.generateAuthToken(params, secretKey.STREAM_CREATE_SECRET);
    debugView.log('AdsManager: make Auth-PodStreamRequest');
  } else {
    debugView.log('AdsManager: make PodStreamRequest without auth');
  }

  this.streamManager.requestStream(streamRequest);
};
ads_manager.js

گوش دادن به رویدادهای جاری‌سازی آگهی

روش AdManager.onStreamEvent() را برای مدیریت پاسخ برنامه‌تان به رویدادهای جاری‌سازی IMA،‏ STREAM_INITIALIZED،‏ AD_BREAK_STARTED، و AD_BREAK_ENDED ایجاد کنید.

/**
 * Handles IMA playback events.
 * @param {!Event} event The event object.
 */
AdManager.prototype.onStreamEvent = function(event) {
  switch (event.type) {
    // Once the stream response data is received, generate pod manifest url
    // for the video stream.
    case google.ima.dai.api.StreamEvent.Type.STREAM_INITIALIZED:
      debugView.log('IMA SDK: stream initialized');
      this.streamData = event.getStreamData();
      break;
    case google.ima.dai.api.StreamEvent.Type.ERROR:
      break;
    // Hide video controls while ad is playing.
    case google.ima.dai.api.StreamEvent.Type.AD_BREAK_STARTED:
      debugView.log('IMA SDK: ad break started');
      this.adPlaying = true;
      this.adBreakStarted = true;
      break;
    // Show video controls when ad ends.
    case google.ima.dai.api.StreamEvent.Type.AD_BREAK_ENDED:
      debugView.log('IMA SDK: ad break ended');
      this.adPlaying = false;
      this.adBreakStarted = false;
      break;
    // Update ad countdown timers.
    case google.ima.dai.api.StreamEvent.Type.AD_PROGRESS:
      break;
    default:
      debugView.log('IMA SDK: ' + event.type);
      break;
  }
};
ads_manager.js

مدیریت فراداده‌های جریان آگهی

برای ارسال اطلاعات رویداد emsg به IMA، روش AdManager.onEmsgEvent() را بااستفاده از روش StreamManager.processMetadata() ایجاد کنید. کلاس پخش‌کننده ویدیو این روش را با روش VideoPlayer.setEmsgEventHandler() فراخوانی می‌کند.

/**
 * Callback on Emsg event.
 * Instructs IMA SDK to fire back VAST events accordingly.
 * @param {!Event} event The event object.
 */
AdManager.prototype.onEmsgEvent = function(event) {
  var data = event.event.messageData;
  var pts = event.event.calculatedPresentationTime;
  if ((data instanceof Uint8Array) && data.byteLength > 0) {
    this.streamManager.processMetadata('ID3', data, pts);
  }
};
ads_manager.js

بار کردن مانیفست غلاف آگهی

روش AdManager.loadAdPodManifest() را برای پیش‌بارگذاری مانیفست دسته آگهی با پخش‌کننده ویدیو ایجاد کنید. یک نشانی وب مانیفست اصالت‌سنجی‌شده بااستفاده از ساختار موجود در روش: مانیفست پاد DASH بسازید.

/**
 * Creates DAI pod url and instructs video player to load manifest.
 * @param {string} networkCode The network code.
 * @param {string} customAssetKey The custom asset key.
 * @param {number} podDuration The duration of the ad pod.
 */
AdManager.prototype.loadAdPodManifest = function (networkCode, customAssetKey, podDuration) {
  if (!this.streamData) {
    debugView.log('AdsManager: No stream data available.');
    return;
  }

  var adBreakId = this.getAdBreakId();
  var expirationTime = Math.trunc(new Date().getTime() / 1000) + 3600;

  var params = {
    ad_break_id: adBreakId,
    custom_asset_key: customAssetKey,
    exp: expirationTime,
    network_code: networkCode,
    pd: podDuration
  };

  var secretKey = getStreamSecretKeys();
  var token = this.generateAuthToken(params, secretKey.MANIFEST_SECRET);
  var encodedToken = encodeURIComponent(token);

  var manifestUrl = 'https://dai.google.com/linear/pods/v1/dash/network/' +
    networkCode + '/custom_asset/' + customAssetKey + '/stream/' +
    this.streamData.streamId + '/ad_break_id/' + adBreakId +
    '/manifest.mpd?pd=' + podDuration + '&auth-token=' + encodedToken;

  this.videoPlayer.preload(manifestUrl);
};
ads_manager.js

برنامه نمونه HbbTV از مقدار adBreakId منحصربه‌فردی که به‌طور تصادفی تولید شده است استفاده می‌کند. در برنامه‌های تولید، مقدار adBreakId رشته‌ای الفبایی-عددی است، برای مثال ab-001، که برای هر وقفه آگهی یک عدد افزایش می‌یابد. تأیید کنید که مقدار adBreakId برای همه بینندگان وقفه آگهی یکسان است. برای دریافت مقدار adBreakId، توصیه می‌کنیم از DAI Ad Break API استفاده کنید. در محیط تولید، مقدار adBreakId و مقدار podDuration را در رویداد جاری‌سازی HbbTV AD_BREAK_ANNOUNCE اضافه کنید.

مهم: باید درخواست مانیفست دسته آگهی خود را اصالت‌سنجی کنید. بدون اصالت‌سنجی، Google Ad Manager نمی‌تواند آگهی‌ها را در مانیفست دسته آگهی ارائه دهد. برای اصالت‌سنجی درخواست، یا وقفه آگهی‌تان را با «میانای برنامه‌سازی کاربردی وقفه آگهی» DAI زمان‌بندی کنید یا auth-token پارامتر پُرسمان را در نشانی وب درخواست مانیفست دسته آگهی بگنجانید.

سپس، کلاس برنامه اصلی را برای برنامه HbbTV خود ایجاد کنید که با همه‌فرستی HbbTV تعامل دارد.