Trong ads_manager.js, hãy xác định một lớp trình bao bọc cho StreamManager SDK IMA. Lớp này sẽ thực hiện các yêu cầu phát trực tuyến, nhận tệp kê khai nhóm quảng cáo, nghe các sự kiện phát trực tuyến IMA và chuyển các sự kiện emsg đến SDK IMA.
Trong ads_manager.js, ứng dụng mẫu IMA HbbTV thiết lập các phương thức sau:
requestStream()onStreamEvent()onEmsgEvent()loadAdPodManifest()
Khởi chạy trình quản lý quảng cáo
Khởi chạy lớp trình quản lý quảng cáo và đặt trình nghe cho các sự kiện phát trực tuyến IMA. Trong lệnh gọi này, hãy đặt trình xử lý sự kiện emsg bằng phương thức 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); };
Yêu cầu luồng nhóm quảng cáo
Tạo phương thức AdManager.requestStream() để tạo đối tượng PodStreamRequest bằng mã mạng Google Ad Manager và khoá thành phần tuỳ chỉnh của luồng. Kiểm thử ứng dụng HbbTV bằng luồng phân phát nhóm DASH mẫu IMA với các thông số luồng sau:
- Mã mạng:
'21775744923' - Khoá thành phần tuỳ chỉnh:
'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); };
Theo dõi các sự kiện của luồng quảng cáo
Tạo phương thức AdManager.onStreamEvent() để xử lý phản hồi của ứng dụng đối với các sự kiện phát trực tuyến IMA, STREAM_INITIALIZED, AD_BREAK_STARTED và 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; } };
Xử lý siêu dữ liệu của luồng quảng cáo
Để truyền thông tin sự kiện emsg đến IMA, hãy tạo phương thức AdManager.onEmsgEvent() bằng phương thức StreamManager.processMetadata(). Lớp trình phát video gọi phương thức này bằng phương thức 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); } };
Tải tệp kê khai nhóm quảng cáo
Tạo phương thức AdManager.loadAdPodManifest() để tải trước tệp kê khai nhóm quảng cáo bằng trình phát video. Tạo URL tệp kê khai bằng cấu trúc trong phần Phương thức: Tệp kê khai nhóm 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('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); };
Ứng dụng mẫu HbbTV sử dụng một podId duy nhất được tạo ngẫu nhiên. Trong các ứng dụng phát hành chính thức, podId là một số nguyên bắt đầu từ 1 và tăng thêm 1 cho mỗi điểm chèn quảng cáo. Đảm bảo rằng podId có cùng giá trị cho tất cả người xem điểm chèn quảng cáo. Để nhận podId, bạn nên sử dụng API Thông báo điểm chèn quảng cáo sớm (EABN). Trong môi trường phát hành chính thức, hãy đưa podId và podDuration vào sự kiện phát trực tuyến HbbTV AD_BREAK_ANNOUNCE.
Tiếp theo, hãy tạo lớp ứng dụng chính cho ứng dụng HbbTV tương tác với chương trình phát sóng HbbTV.