إنشاء فئة "مدير الإعلانات"

في ads_manager.js، حدِّد فئة برنامج تضمين لـ StreamManager لأداة تطوير البرامج لإعلانات الوسائط التفاعلية تعمل على إرسال طلبات البث والحصول على بيان مجموعة الإعلانات المتسلسلة والاستماع إلى أحداث بث إعلانات الوسائط التفاعلية وتمرير أحداث الرسائل الإلكترونية إلى حزمة تطوير البرامج لإعلانات الوسائط التفاعلية.

في ads_manager.js، يُعدّل تطبيق IMA HbbTV النموذجي الطرق التالية:

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

إعداد "مدير الإعلانات"

احرص على إعداد فئة "مدير الإعلانات" وإعداد أدوات معالجة أحداث بث إعلانات الوسائط التفاعلية. وفي هذه المكالمة، يمكنك ضبط معالج حدث emsg باستخدام الطريقة VideoPlayer.setEmsgEventHandler().

/**
 * 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" ومفتاح مادة العرض المخصّص للبث. اختبِر تطبيق 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();
  streamRequest.networkCode = networkCode;
  streamRequest.customAssetKey = customAssetKey;
  streamRequest.format = 'dash';
  debugView.log('AdsManager: make PodStreamRequest');
  this.streamManager.requestStream(streamRequest);
};
ads_manager.js

الاستماع إلى أحداث بث الإعلانات

يمكنك إنشاء طريقة AdManager.onStreamEvent() للتعامل مع استجابة تطبيقك لأحداث بث إعلانات الوسائط التفاعلية، و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

التعامل مع البيانات الوصفية لمصدر إعلان

لتمرير معلومات حدث الرسالة الإلكترونية إلى أداة الوسائط التفاعلية (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() لتحميل بيان مجموعة الإعلانات المتسلسلة مسبقًا مع مشغّل الفيديو. ويمكنك إنشاء عنوان URL للبيان باستخدام البنية في الطريقة: DASH pod سجل.

/**
 * 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('IMA SDK: No DAI pod session registered.');
    return;
  }

  var MANIFEST_BASE_URL = 'https://dai.google.com/linear/pods/v1/dash/network/';
  // Method: DASH pod manifest reference docs:
  // https://developers.google.com/ad-manager/dynamic-ad-insertion/api/pod-serving/reference/live#method_dash_pod_manifest
  var manifestUrl = MANIFEST_BASE_URL + networkCode + '/custom_asset/' +
    customAssetKey + '/stream/' + this.streamData.streamId + '/pod/' +
    this.getPodId() + '/manifest.mpd?pd=' + podDuration;
  this.videoPlayer.preload(manifestUrl);
};
ads_manager.js

يستخدم نموذج تطبيق HbbTV نموذج podId فريدًا يتم إنشاؤه عشوائيًا. في التطبيقات العلنية، يكون podId هو عدد صحيح يبدأ من واحد ويزيد بمقدار واحد لكل فاصل إعلاني. تأكَّد من أنّ القيمة podId هي نفسها لجميع مشاهدي الفاصل الإعلاني. للحصول على podId، ننصح باستخدام واجهة برمجة التطبيقات لميزة "إشعارات وقت الفواصل الإعلانية المبكرة" (EABN). في بيئة الإنتاج، أدرِج podId وpodDuration في حدث بث HbbTV AD_BREAK_ANNOUNCE.

بعد ذلك، أنشئ فئة التطبيق الرئيسية لتطبيق HbbTV الذي يتفاعل مع بث HbbTV.

السابق
إعداد فئة اللاعب
التالي
إنشاء فئة التطبيق