लीनियर डीएआई स्ट्रीम में, तय समय के मेटाडेटा को मैनेज करना

इंटरैक्टिव मीडिया विज्ञापन (IMA) डाइनैमिक ऐड इंसर्शन (डीएआई) SDK टूल स्ट्रीम के मीडिया सेगमेंट में एम्बेड की गई मेटाडेटा की जानकारी (इन-बैंड मेटाडेटा), का इस्तेमाल किया जा सकता है. पोज़िशन और क्लाइंट-साइड विज्ञापन इवेंट बनाए जा सकते हैं. मेटाडेटा अलग-अलग फ़ॉर्मैट में भेजा जाता है, चलाई जा रही है.

वीडियो प्लेयर को समय के हिसाब से मेटाडेटा बैच में मिलता है. अलग-अलग प्लेयर के लिए, मेटाडेटा को शेड्यूल किए गए समय पर या बैच में दिखाया जा सकता है. हर मेटाडेटा स्ट्रिंग में इससे जुड़ा प्रज़ेंटेशन टाइमस्टैंप (पीटीएस) होता है. इससे पता चलता है कि यह कब होना चाहिए ट्रिगर किया गया.

मेटाडेटा कैप्चर करके, उसे IMA डीएआई SDK टूल को भेजना आपके ऐप्लिकेशन की ज़िम्मेदारी है. इस जानकारी को भेजने के लिए, SDK टूल ये तरीके उपलब्ध कराता है:

onTimedMetadata

यह तरीका उन मेटाडेटा स्ट्रिंग को फ़ॉरवर्ड करता है जो प्रोसेस होने के लिए तैयार हैं SDK टूल. इसमें एक तर्क की ज़रूरत होती है:

  • metadata: एक ऑब्जेक्ट, जिसमें TXXX कुंजी के साथ उससे जुड़ी स्ट्रिंग भी है google_ के शुरू में लगाई गई वैल्यू.
processMetadata

यह तरीका, मेटाडेटा स्ट्रिंग को इस शेड्यूल के बाद प्रोसेस करता है कि SDK टूल, बताए गए PTS. इसमें यहां दिए गए आर्ग्युमेंट इस्तेमाल किए जाते हैं:

  • type: एक स्ट्रिंग जिसमें प्रोसेस किए जा रहे इवेंट का टाइप होता है. स्वीकार की गई HLS के लिए ID3 या DASH के लिए urn:google:dai:2018
  • data: google_ से प्रीफ़िक्स किया गया एक स्ट्रिंग मान या एक बाइट अरे जो इस फ़ॉर्मैट का पालन करता है ID3:u\0004u\000u\000u\0000TXXXu\0004u\000u\000u\0000google_xxxxxxxx.
  • timestamp: डेटा प्रोसेस होने के बाद सेकंड में टाइमस्टैंप.

IMA डीएआई SDK टूल के साथ काम करने वाली हर स्ट्रीम टाइप में, तय किए गए समय वाले एक खास फ़ॉर्मैट का इस्तेमाल किया जाता है मेटाडेटा, जैसा कि नीचे दिए गए सेक्शन में बताया गया है.

एचएलएस MPEG2TS स्ट्रीम

MPEG2TS सेगमेंट का इस्तेमाल करके लीनियर डीएआई एचएलएस स्ट्रीम, इन-बैंड ID3 टैग के ज़रिए वीडियो प्लेयर इस्तेमाल कर सकते हैं. ये ID3 टैग इसमें एम्बेड किए गए हैं MPEG2TS सेगमेंट और उन्हें TXXX फ़ील्ड नाम दिया जाता है (उपयोगकर्ता की ओर से तय किए गए कस्टम टेक्स्ट के लिए) कॉन्टेंट).

Safari में वीडियो चलाएं

Safari, छिपे हुए ट्रैक के तौर पर ID3 टैग को अपने-आप प्रोसेस करता है. इसलिए, क्यूचेंज इवेंट होते हैं मेटाडेटा के हर हिस्से को प्रोसेस करने के लिए, सही समय पर फ़ायर करें. यहां से निकल जाना ठीक है IMA डीएआई 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 में ऑफ़सेट नहीं करता. नहीं सैंपल डेटा को बाइट अरे से स्ट्रिंग में डिकोड करने या फ़िल्टर करने के लिए ज़रूरी है जो आईडी3 टैग काम के नहीं होते हैं. इसकी वजह यह है कि IMA डीएआई SDK टूल इस डीकोडिंग और फ़िल्टर का काम करता है स्वचालित रूप से.

यहां एक उदाहरण दिया गया है:

hls.on(Hls.Events.FRAG_PARSING_METADATA, (e, data) => {
  if (streamManager && data) {
    data.samples.forEach((sample) => {
      streamManager.processMetadata('ID3', sample.data, sample.pts);
    });
  }
});
...

एचएलएस सीएमएएफ़ स्ट्रीम

कॉमन मीडिया ऐप्लिकेशन फ़्रेमवर्क (सीएमएएफ़) पास का इस्तेमाल करके लीनियर डीएआई एचएलएस स्ट्रीम करना ID3 से लेकर अब तक इन-बैंड eMSGv1 बॉक्स के ज़रिए समयबद्ध मेटाडेटा CMAF स्टैंडर्ड. ये eMSG बॉक्स हैं हर मीडिया सेगमेंट की शुरुआत में एम्बेड किया गया हो, जिसमें हर ID3 eMSG में शामिल हो एक PTS दिखाया जाता है, जो स्ट्रीम में असमानता के बारे में होता है.

HLS.js के 1.2.0 वर्शन के हिसाब से, हमारे दोनों सुझाए गए प्लेयर आईडी3 पास करते हैं के ज़रिए उपयोगकर्ता को दिखाया जाना चाहिए, जैसे कि वे ID3 टैग हों. इस वजह से, ये उदाहरण एचएलएस एमपीईजी2टीएस स्ट्रीम के उदाहरण जैसे ही हैं. हालांकि, ऐसा हो सकता है कि ऐसा हर खिलाड़ी के साथ नहीं होता. इसलिए, एचएलएस सीएमएएफ़ के साथ काम करना स्ट्रीम को eMSG के ज़रिए ID3 को पार्स करने के लिए यूनीक कोड की ज़रूरत हो सकती है.

Safari में वीडियो चलाएं

Safari, eMSG मेटाडेटा के ज़रिए ID3 को pseudo ID3 इवेंट की तरह मानता है और उन्हें बैच, अपने-आप, छिपे हुए ट्रैक के रूप में, जैसे कि क्यूचेंज इवेंट मेटाडेटा के हर हिस्से को प्रोसेस करने के लिए सही समय पर ट्रिगर किया जाता है. कोई समस्या नहीं है सभी मेटाडेटा को IMA डीएआई 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

वर्शन 1.2.0 के बाद से, HLS.js, eMSG मेटाडेटा के ज़रिए ID3 को pseudo ID3 के तौर पर इस्तेमाल करता है इवेंट की जानकारी देता है. इन्हें FRAG_PARSING_METADATA इवेंट के ज़रिए अलग-अलग बैच में उपलब्ध कराया जाता है चुनें. HLS.js, बाइट सरणियों के ID3 डेटा का अनुवाद नहीं करता है स्ट्रिंग के साथ जोड़ा जाता है और इवेंट को उनके संबंधित PTS में ऑफ़सेट नहीं करता. नहीं यह ज़रूरी है कि सैंपल डेटा को बाइट अरे से स्ट्रिंग में डिकोड किया जाए, क्योंकि IMA डीएआई SDK टूल यह डिकोडिंग अपने-आप करता है.

यहां एक उदाहरण दिया गया है:

hls.on(Hls.Events.FRAG_PARSING_METADATA, (e, data) => {
  if (streamManager && data) {
    data.samples.forEach((sample) => {
      streamManager.processMetadata('ID3', sample.data, sample.pts);
    });
  }
});
...

डैश स्ट्रीम

लीनियर डीएआई डैश स्ट्रीम, इवेंट स्ट्रीम में मेटाडेटा को मेनिफ़ेस्ट इवेंट के तौर पर पास करती हैं कस्टम schemeIdUri मान urn:google:dai:2018. इनमें से हर इवेंट स्ट्रीम में एक टेक्स्ट पेलोड और पीटीएस शामिल होते हैं.

DASH.js

Dash.js, हर एक की schemaIdUri वैल्यू के बाद नाम रखने वाले कस्टम इवेंट हैंडलर उपलब्ध कराता है इवेंट स्ट्रीम. ये कस्टम हैंडलर बैच में फ़ायर किए जाते हैं. इन्हें आपके काम करने के लिए छोड़ दिया जाता है इवेंट का सही समय तय करने के लिए PTS वैल्यू को प्रोसेस करें. IMA डीएआई 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);
});
...

शाका प्लेयर

Shaka Player अपने timelineregionenter इवेंट के हिस्से के तौर पर इवेंट दिखाते हैं. पूरा होने की तारीख शाका प्लेयर के साथ फ़ॉर्मैटिंग असंगत होने पर, मेटाडेटा मान विवरण प्रॉपर्टी के माध्यम से रॉ डेटा फिर से हासिल किया गया eventElement.attributes['messageData'].value.

यहां एक उदाहरण दिया गया है:

player.addEventListener('timelineregionenter', function(event) {
  const detail = event.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;
    streamManager.processMetadata("urn:google:dai:2018", mediaId, pts);
  }
});
...

पॉड सर्विंग

पॉड सर्विंग के लिए, तय समय पर पास करने के लिए अलग-अलग कॉन्फ़िगरेशन होते हैं नीचे दी गई शर्तों के हिसाब से मेटाडेटा:

  • लाइव स्ट्रीम या वीओडी (वीडियो ऑन डिमांड) स्ट्रीम टाइप
  • HLS या DASH स्ट्रीम फ़ॉर्मैट
  • किस तरह का प्लेयर इस्तेमाल किया जा रहा है
  • किस तरह का डीएआई बैकएंड इस्तेमाल किया जा रहा है

एचएलएस स्ट्रीम फ़ॉर्मैट (लाइव और वीओडी स्ट्रीम, HLS.js प्लेयर)

अगर HLS.js प्लेयर का इस्तेमाल किया जा रहा है, तो यह सुनें HLS.js FRAG_PARSING_METADATA इवेंट को ID3 मेटाडेटा के तौर पर पाने और उसे 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 स्ट्रीम स्ट्रीम फ़ॉर्मैट, लाइव और वीओडी स्ट्रीम टाइप)

अगर DASH.js प्लेयर का इस्तेमाल किया जा रहा है, तो लाइव या वीओडी (वीडियो ऑन डिमांड) के लिए ID3 का मेटाडेटा सुनने के लिए, आपको अलग-अलग स्ट्रिंग का इस्तेमाल करना होगा स्ट्रीम:

  • लाइव स्ट्रीम: 'https://developer.apple.com/streaming/emsg-id3'
  • वीओडी (वीडियो ऑन डिमांड) स्ट्रीम: 'urn:google:dai:2018'

StreamManager.processMetadata() की मदद से, SDK टूल में ID3 मेटाडेटा पास करें.

सब कुछ लोड हो जाने और तैयार हो जाने के बाद, वीडियो कंट्रोल अपने-आप दिखाने के लिए, 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);
}

लाइव स्ट्रीम के साथ Shaka Player (DASH स्ट्रीम फ़ॉर्मैट)

अगर Shaka Player का इस्तेमाल लाइव स्ट्रीम चलाने की सुविधा, मेटाडेटा इवेंट को सुनने के लिए '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});
}

वीओडी स्ट्रीम के साथ शाका प्लेयर (डीएएसएच स्ट्रीम फ़ॉर्मैट)

अगर Shaka Player का इस्तेमाल वीओडी (वीडियो ऑन डिमांड) स्ट्रीम प्लेबैक, इसे सुनने के लिए '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);
       }
}