ইন্টারেক্টিভ মিডিয়া অ্যাডস (IMA) ডাইনামিক অ্যাড ইনসারশন (DAI) SDK দর্শকদের অবস্থান এবং ক্লায়েন্ট-সাইড বিজ্ঞাপন ইভেন্ট ট্র্যাক করার জন্য স্ট্রিমের মিডিয়া সেগমেন্টে (ইন-ব্যান্ড মেটাডেটা) বা স্ট্রিমিং ম্যানিফেস্ট ফাইলে (ইন-ম্যানিফেস্ট মেটাডেটা) এমবেড করা মেটাডেটা তথ্যের উপর নির্ভর করে। কোন ধরনের স্ট্রিম প্লে করা হচ্ছে তার উপর নির্ভর করে মেটাডেটা বিভিন্ন ফরম্যাটে পাঠানো হয়।
ভিডিও প্লেয়ারটি ব্যাচ আকারে সময়-ভিত্তিক মেটাডেটা গ্রহণ করে। প্লেয়ারের উপর নির্ভর করে, মেটাডেটা নির্ধারিত সময়ে অথবা ব্যাচ আকারে প্রদর্শিত হতে পারে। প্রতিটি মেটাডেটা স্ট্রিং-এর সাথে একটি প্রেজেন্টেশন টাইমস্ট্যাম্প (PTS) যুক্ত থাকে, যা নির্দেশ করে কখন এটি ট্রিগার করা উচিত।
আপনার অ্যাপ মেটাডেটা সংগ্রহ করে তা IMA DAI SDK-তে পাঠানোর জন্য দায়ী। এই তথ্য পাঠানোর জন্য SDK নিম্নলিখিত পদ্ধতিগুলো প্রদান করে:
- onTimedMetadata
এই মেথডটি প্রসেস করার জন্য প্রস্তুত মেটাডেটা স্ট্রিংগুলোকে SDK-তে ফরোয়ার্ড করে। এটি একটিমাত্র আর্গুমেন্ট গ্রহণ করে:
-
metadata: একটি অবজেক্ট, যাতেTXXXনামের একটি কী এবংgoogle_উপসর্গযুক্ত একটি সংশ্লিষ্ট স্ট্রিং ভ্যালু থাকে।
-
- মেটাডেটা প্রক্রিয়া করুন
এই পদ্ধতিটি নির্দিষ্ট PTS-এর পরে SDK দ্বারা প্রক্রিয়াকরণের জন্য মেটাডেটা স্ট্রিংগুলোকে শিডিউল করে। এটি নিম্নলিখিত আর্গুমেন্টগুলো গ্রহণ করে:
-
type: একটি স্ট্রিং, যা প্রক্রিয়াকৃত ইভেন্টের ধরণ ধারণ করে। HLS-এর জন্যID3অথবা DASH-এর জন্যurn:google:dai:2018হলো গ্রহণযোগ্য মান। -
data: হয়google_উপসর্গযুক্ত একটি স্ট্রিং ভ্যালু অথবা একটি বাইট অ্যারে যাID3:u\0004u\000u\000u\0000TXXXu\0004u\000u\000u\0000google_xxxxxxxx. এই ফরম্যাট অনুসরণ করে। -
timestamp: সেকেন্ডে সেই সময়, যখন ডেটা প্রসেস করা হবে।
-
IMA DAI SDK দ্বারা সমর্থিত প্রতিটি স্ট্রিম টাইপ এক অনন্য ধরনের সময়ভিত্তিক মেটাডেটা ব্যবহার করে, যা নিম্নলিখিত বিভাগগুলিতে বর্ণনা করা হয়েছে।
HLS MPEG2TS স্ট্রিম
MPEG2TS সেগমেন্ট ব্যবহারকারী লিনিয়ার DAI HLS স্ট্রিমগুলো ইন-ব্যান্ড ID3 ট্যাগের মাধ্যমে ভিডিও প্লেয়ারে সময়-ভিত্তিক মেটাডেটা প্রেরণ করে। এই ID3 ট্যাগগুলো MPEG2TS সেগমেন্টের মধ্যে এমবেড করা থাকে এবং কাস্টম ব্যবহারকারী-সংজ্ঞায়িত টেক্সট কন্টেন্টের জন্য এগুলোকে TXXX ফিল্ড নামটি দেওয়া হয়।
সাফারিতে প্লেব্যাক
সাফারি ID3 ট্যাগগুলোকে একটি হিডেন ট্র্যাক হিসেবে স্বয়ংক্রিয়ভাবে প্রসেস করে, ফলে প্রতিটি মেটাডেটা প্রসেস করার জন্য কিউচেঞ্জ ইভেন্টগুলো সঠিক সময়ে ফায়ার হয়। বিষয়বস্তু বা ধরন নির্বিশেষে সমস্ত মেটাডেটা IMA DAI SDK-তে পাঠানো যেতে পারে। অপ্রাসঙ্গিক মেটাডেটা স্বয়ংক্রিয়ভাবে ফিল্টার হয়ে যায়।
এখানে একটি উদাহরণ দেওয়া হলো:
videoElement.textTracks.addEventListener('addtrack', (e) => {
const track = e.track;
if (track.kind === 'metadata') {
track.mode = 'hidden';
track.addEventListener('cuechange', () => {
for (const cue of track.activeCues) {
const metadata = {};
metadata[cue.value.key] = cue.value.data;
streamManager.onTimedMetadata(metadata);
}
});
}
});
...
HLS.js
HLS.js, FRAG_PARSING_METADATA ইভেন্টের মাধ্যমে স্যাম্পলের একটি অ্যারে হিসেবে ব্যাচ আকারে ID3 ট্যাগ সরবরাহ করে। HLS.js ID3 ডেটাকে বাইট অ্যারে থেকে স্ট্রিং-এ রূপান্তর করে না এবং ইভেন্টগুলোকে তাদের সংশ্লিষ্ট PTS-এ অফসেট করে না। স্যাম্পল ডেটাকে বাইট অ্যারে থেকে স্ট্রিং-এ ডিকোড করা বা অপ্রাসঙ্গিক ID3 ট্যাগ ফিল্টার করে বাদ দেওয়ার প্রয়োজন হয় না, কারণ IMA DAI SDK এই ডিকোডিং এবং ফিল্টারিং স্বয়ংক্রিয়ভাবে সম্পন্ন করে।
এখানে একটি উদাহরণ দেওয়া হলো:
hls.on(Hls.Events.FRAG_PARSING_METADATA, (e, data) => {
if (streamManager && data) {
data.samples.forEach((sample) => {
streamManager.processMetadata('ID3', sample.data, sample.pts);
});
}
});
...
এইচএলএস সিএমএএফ স্ট্রিম
কমন মিডিয়া অ্যাপ্লিকেশন ফ্রেমওয়ার্ক (CMAF) ব্যবহারকারী লিনিয়ার DAI HLS স্ট্রিমগুলো ID3 থেকে CMAF স্ট্যান্ডার্ড অনুসরণ করে ইন-ব্যান্ড eMSGv1 বক্সের মাধ্যমে টাইমড মেটাডেটা প্রেরণ করে। এই eMSG বক্সগুলো প্রতিটি মিডিয়া সেগমেন্টের শুরুতে এমবেড করা থাকে এবং প্রতিটি ID3 eMSG-তে স্ট্রিমের সর্বশেষ বিচ্ছিন্নতার সাপেক্ষে একটি PTS থাকে।
HLS.js-এর 1.2.0 রিলিজ অনুযায়ী, আমাদের প্রস্তাবিত উভয় প্লেয়ারই ID3-কে ID3 ট্যাগের মতোই CMAF-এর মাধ্যমে ব্যবহারকারীর কাছে পাঠায়। এই কারণে, নিম্নলিখিত উদাহরণগুলো HLS MPEG2TS স্ট্রিমের মতোই। তবে, সব প্লেয়ারের ক্ষেত্রে এমনটা নাও হতে পারে, তাই HLS CMAF স্ট্রিমের জন্য সাপোর্ট ইমপ্লিমেন্ট করতে eMSG-এর মাধ্যমে ID3 পার্স করার জন্য স্বতন্ত্র কোডের প্রয়োজন হতে পারে।
সাফারিতে প্লেব্যাক
সাফারি eMSG মেটাডেটার মাধ্যমে ID3-কে ছদ্ম ID3 ইভেন্ট হিসেবে বিবেচনা করে এবং সেগুলোকে একটি হিডেন ট্র্যাক হিসেবে স্বয়ংক্রিয়ভাবে ব্যাচ আকারে সরবরাহ করে, যাতে প্রতিটি মেটাডেটা প্রসেস করার জন্য সঠিক সময়ে কিউচেঞ্জ ইভেন্টগুলো ফায়ার হয়। টাইমিংয়ের জন্য প্রাসঙ্গিক হোক বা না হোক, সমস্ত মেটাডেটা IMA DAI SDK-তে পাঠানো যেতে পারে। DAI-সম্পর্কিত নয় এমন যেকোনো মেটাডেটা স্বয়ংক্রিয়ভাবে ফিল্টার হয়ে যায়।
এখানে একটি উদাহরণ দেওয়া হলো:
videoElement.textTracks.addEventListener('addtrack', (e) => {
const track = e.track;
if (track.kind === 'metadata') {
track.mode = 'hidden';
track.addEventListener('cuechange', () => {
for (const cue of track.activeCues) {
const metadata = {};
metadata[cue.value.key] = cue.value.data;
streamManager.onTimedMetadata(metadata);
}
});
}
});
...
HLS.js
সংস্করণ ১.২.০ থেকে, HLS.js eMSG মেটাডেটার মাধ্যমে ID3-কে ছদ্ম ID3 ইভেন্ট হিসেবে গণ্য করে এবং FRAG_PARSING_METADATA ইভেন্টের মাধ্যমে স্যাম্পলের একটি অ্যারে হিসেবে ব্যাচে ব্যাচে সরবরাহ করে। HLS.js ID3 ডেটাকে বাইট অ্যারে থেকে স্ট্রিং-এ অনুবাদ করে না এবং ইভেন্টগুলোকে তাদের সংশ্লিষ্ট PTS-এ অফসেট করে না। স্যাম্পল ডেটাকে বাইট অ্যারে থেকে স্ট্রিং-এ ডিকোড করার প্রয়োজন নেই, কারণ IMA DAI SDK এই ডিকোডিং স্বয়ংক্রিয়ভাবে করে থাকে।
এখানে একটি উদাহরণ দেওয়া হলো:
hls.on(Hls.Events.FRAG_PARSING_METADATA, (e, data) => {
if (streamManager && data) {
data.samples.forEach((sample) => {
streamManager.processMetadata('ID3', sample.data, sample.pts);
});
}
});
...
ড্যাশ স্ট্রিম
লিনিয়ার DAI DASH স্ট্রিমগুলো urn:google:dai:2018 এই কাস্টম schemeIdUri ভ্যালুসহ একটি ইভেন্ট স্ট্রিমে ম্যানিফেস্ট ইভেন্ট হিসেবে মেটাডেটা প্রেরণ করে। এই স্ট্রিমগুলোর প্রতিটি ইভেন্টে একটি টেক্সট পেলোড এবং PTS থাকে।
ড্যাশ.জেএস
Dash.js প্রতিটি ইভেন্ট স্ট্রিমের schemeIdUri মানের নামে কাস্টম ইভেন্ট হ্যান্ডলার সরবরাহ করে। এই কাস্টম হ্যান্ডলারগুলো ব্যাচ আকারে ফায়ার হয়, তাই ইভেন্টের সময় সঠিকভাবে নির্ধারণ করার জন্য PTS মানটি প্রসেস করার দায়িত্ব আপনার উপরই বর্তায়। IMA DAI SDK তার streamManager মেথড, processMetadata() ব্যবহার করে আপনার জন্য এই কাজটি করতে পারে।
এখানে একটি উদাহরণ দেওয়া হলো:
const dash = dashjs.MediaPlayer().create();
dash.on('urn:google:dai:2018', (payload) => {
const mediaId = payload.event.messageData;
const pts = payload.event.calculatedPresentationTime;
streamManager.processMetadata('urn:google:dai:2018', mediaId, pts);
});
...
শাকা প্লেয়ার
শাকা প্লেয়ার তাদের timelineregionenter ইভেন্টের অংশ হিসেবে ইভেন্টগুলো প্রদর্শন করে। শাকা প্লেয়ারের সাথে ফরম্যাটিংগত অসামঞ্জস্যতার কারণে, মেটাডেটা মানটি অবশ্যই eventNode.attributes['messageData'] ডিটেইল প্রপার্টির মাধ্যমে সরাসরি সংগ্রহ করতে হবে।
এখানে একটি উদাহরণ দেওয়া হলো:
player.addEventListener('timelineregionenter', function(event) {
const detail = event.detail;
if ( detail.eventNode.attributes &&
detail.eventNode.attributes['messageData']) {
const mediaId = detail.eventNode.attributes['messageData'];
const pts = detail.startTime;
streamManager.processMetadata("urn:google:dai:2018", mediaId, pts);
}
});
...
পড পরিবেশন
পড সার্ভিংয়ের ক্ষেত্রে, নিম্নলিখিত মানদণ্ডের উপর নির্ভর করে টাইমড মেটাডেটা প্রেরণের জন্য বিভিন্ন কনফিগারেশন রয়েছে:
- লাইভ বা ভিওডি স্ট্রিমের ধরন
- HLS বা DASH স্ট্রিম ফরম্যাট
- যে ধরনের খেলোয়াড় ব্যবহার করা হচ্ছে
- ব্যবহৃত DAI ব্যাকএন্ডের ধরন
HLS স্ট্রিম ফরম্যাট (লাইভ এবং VOD স্ট্রিম, HLS.js প্লেয়ার)
আপনি যদি HLS.js প্লেয়ার ব্যবহার করেন, তাহলে ID3 মেটাডেটা পেতে HLS.js-এর FRAG_PARSING_METADATA ইভেন্টটি শুনুন এবং StreamManager.processMetadata() ব্যবহার করে তা SDK-তে পাঠান।
সবকিছু লোড ও প্রস্তুত হয়ে যাওয়ার পর ভিডিওটি স্বয়ংক্রিয়ভাবে চালু করতে, প্লেব্যাক ট্রিগার করার জন্য HLS.js-এর MANIFEST_PARSED ইভেন্টটি শুনুন।
function loadStream(streamID) {
hls.loadSource(url);
hls.attachMedia(videoElement);
// Timed metadata is passed HLS stream events to the streamManager.
hls.on(Hls.Events.FRAG_PARSING_METADATA, parseID3Events);
hls.on(Hls.Events.MANIFEST_PARSED, startPlayback);
}
function parseID3Events(event, data) {
if (streamManager && data) {
// For each ID3 tag in the metadata, pass in the type - ID3, the
// tag data (a byte array), and the presentation timestamp (PTS).
data.samples.forEach((sample) => {
streamManager.processMetadata('ID3', sample.data, sample.pts);
});
}
}
function startPlayback() {
console.log('Video Play');
videoElement.play();
}
DASH.js (DASH স্ট্রিম ফরম্যাট, লাইভ এবং VOD স্ট্রিম টাইপ)
আপনি যদি DASH.js প্লেয়ার ব্যবহার করেন, তাহলে লাইভ বা VOD স্ট্রিমের জন্য ID3 মেটাডেটা শোনার জন্য আপনাকে ভিন্ন স্ট্রিং ব্যবহার করতে হবে:
- লাইভস্ট্রিম:
'https://developer.apple.com/streaming/emsg-id3' - VOD স্ট্রিম:
'urn:google:dai:2018'
StreamManager.processMetadata() ব্যবহার করে ID3 মেটাডেটা SDK-তে পাঠান।
সবকিছু লোড ও প্রস্তুত হয়ে যাওয়ার পর ভিডিও কন্ট্রোলগুলো স্বয়ংক্রিয়ভাবে দেখানোর জন্য, DASH.js-এর MANIFEST_LOADED ইভেন্টটি শুনুন।
const googleLiveSchema = 'https://developer.apple.com/streaming/emsg-id3';
const googleVodSchema = 'urn:google:dai:2018';
dashPlayer.on(googleLiveSchema, processMetadata);
dashPlayer.on(googleVodSchema, processMetadata);
dashPlayer.on(dashjs.MediaPlayer.events.MANIFEST_LOADED, loadlistener);
function processMetadata(metadataEvent) {
const messageData = metadataEvent.event.messageData;
const timestamp = metadataEvent.event.calculatedPresentationTime;
// Use StreamManager.processMetadata() if your video player provides raw
// ID3 tags, as with dash.js.
streamManager.processMetadata('ID3', messageData, timestamp);
}
function loadlistener() {
showControls();
// This listener must be removed, otherwise it triggers as addional
// manifests are loaded. The manifest is loaded once for the content,
// but additional manifests are loaded for upcoming ad breaks.
dashPlayer.off(dashjs.MediaPlayer.events.MANIFEST_LOADED, loadlistener);
}
লাইভস্ট্রিম সহ শাকা প্লেয়ার (ড্যাশ স্ট্রিম ফরম্যাট)
আপনি যদি লাইভস্ট্রিম প্লেব্যাকের জন্য শাকা প্লেয়ার ব্যবহার করেন, তাহলে মেটাডেটা ইভেন্ট শোনার জন্য 'emsg' স্ট্রিংটি ব্যবহার করুন। এরপর, StreamManager.onTimedMetadata() কল করার সময় ইভেন্ট মেসেজের ডেটা ব্যবহার করুন।
shakaPlayer.addEventListener('emsg', (event) => onEmsgEvent(event));
function onEmsgEvent(metadataEvent) {
// Use StreamManager.onTimedMetadata() if your video player provides
// processed metadata, as with Shaka player livestreams.
streamManager.onTimedMetadata({'TXXX': metadataEvent.detail.messageData});
}
VOD স্ট্রিম সহ শাকা প্লেয়ার (DASH স্ট্রিম ফরম্যাট)
আপনি যদি VOD স্ট্রিম প্লেব্যাকের জন্য শাকা প্লেয়ার ব্যবহার করেন, তাহলে মেটাডেটা ইভেন্ট শোনার জন্য 'timelineregionenter' স্ট্রিংটি ব্যবহার করুন। এরপর, StreamManager.processMetadata() কল করার সময় 'urn:google:dai:2018' স্ট্রিংটির সাথে ইভেন্ট মেসেজের ডেটা ব্যবহার করুন।
shakaPlayer.addEventListener('timelineregionenter', (event) => onTimelineEvent(event));
function onTimelineEvent(metadataEvent) {
const detail = metadataEvent.detail;
if ( detail.eventElement.attributes &&
detail.eventElement.attributes['messageData'] &&
detail.eventElement.attributes['messageData'].value ) {
const mediaId = detail.eventElement.attributes['messageData'].value;
const pts = detail.startTime;
// Use StreamManager.processMetadata() if your video player provides raw
// ID3 tags, as with Shaka player VOD streams.
streamManager.processMetadata('urn:google:dai:2018', mediaId, pts);
}
}