IMA SDK टूल की मदद से, अपनी वेबसाइटों और ऐप्लिकेशन में आसानी से मल्टीमीडिया विज्ञापन इंटिग्रेट किए जा सकते हैं. IMA SDK टूल, वीएएसटी (वीडियो विज्ञापन देने के लिए टेंप्लेट) का पालन करने वाले किसी भी विज्ञापन सर्वर से विज्ञापनों का अनुरोध कर सकते हैं. साथ ही, आपके ऐप्लिकेशन में विज्ञापन चलाने की सुविधा को मैनेज कर सकते हैं. IMA डीएआई SDK की मदद से, ऐप्लिकेशन विज्ञापन और कॉन्टेंट वीडियो के लिए स्ट्रीम का अनुरोध करते हैं. यह वीओडी या लाइव कॉन्टेंट हो सकता है. इसके बाद, SDK टूल एक साथ कई वीडियो स्ट्रीम दिखाता है, ताकि आपको अपने ऐप्लिकेशन में विज्ञापन और कॉन्टेंट वीडियो के बीच स्विच करने की ज़रूरत न पड़े.
डीआई (डायनामिक विज्ञापन) का वह समाधान चुनें जिसमें आपकी दिलचस्पी है
Google Cloud Video Stitcher API के साथ रजिस्टर की गई वीओडी स्ट्रीम चलाना
इस गाइड में, Google Cloud वीओडी स्ट्रीम सेशन का अनुरोध करने और उसे चलाने के लिए, HTML5 के लिए IMA DAI SDK टूल का इस्तेमाल करने का तरीका बताया गया है.
इस गाइड में, IMA डीएआई के लिए शुरू करने के लिए गाइड में दिए गए बुनियादी उदाहरण के बारे में ज़्यादा जानकारी दी गई है.
अन्य प्लैटफ़ॉर्म के साथ इंटिग्रेट करने या IMA क्लाइंट-साइड SDK टूल इस्तेमाल करने के बारे में जानने के लिए, इंटरैक्टिव मीडिया विज्ञापन SDK टूल देखें.
इंटिग्रेशन का पूरा सैंपल देखने या उसे फ़ॉलो करने के लिए, HLS या DASH के लिए, Cloud वीडियो स्टिचर का उदाहरण डाउनलोड करें.
Google Cloud प्रोजेक्ट सेट अप करना
Google Cloud प्रोजेक्ट सेट अप करें और प्रोजेक्ट को ऐक्सेस करने के लिए, सेवा खातों को कॉन्फ़िगर करें.
IMA SDK टूल में इस्तेमाल करने के लिए, ये वैरिएबल डालें:- जगह
- वह Google Cloud क्षेत्र जहां आपका वीओडी कॉन्फ़िगरेशन बनाया गया था:
LOCATION - प्रोजेक्ट नंबर
- Video Stitcher API का इस्तेमाल करने वाले Google Cloud प्रोजेक्ट का नंबर:
PROJECT_NUMBER - OAuth टोकन
सेवा खाते का कम समय के लिए मान्य OAuth टोकन, जिसमें Video Stitcher उपयोगकर्ता की भूमिका शामिल हो:
OAUTH_TOKEN
कुछ समय के लिए मान्य OAuth टोकन बनाने के बारे में ज़्यादा जानें. OAuth टोकन का इस्तेमाल, कई अनुरोधों में तब तक किया जा सकता है, जब तक उसकी समयसीमा खत्म न हो गई हो.
- नेटवर्क कोड
विज्ञापनों का अनुरोध करने के लिए Ad Manager नेटवर्क कोड:
NETWORK_CODE
- वीओडी कॉन्फ़िगरेशन आईडी
वीओडी स्ट्रीम के लिए वीओडी कॉन्फ़िगरेशन आईडी:
VOD_CONFIG_IDक्लाउड स्टिचिंग से वीओडी कॉन्फ़िगरेशन आईडी बनाने के बारे में गाइड में, वीओडी कॉन्फ़िगरेशन आईडी बनाने के बारे में ज़्यादा पढ़ें.
डेवलपमेंट एनवायरमेंट कॉन्फ़िगर करना
IMA के सैंपल ऐप्लिकेशन में सिर्फ़ एचएलएस स्ट्रीम के अनुरोध दिखाए जाते हैं. VideoStitcherVodStreamRequest क्लास बनाते समय, अब भी DASH स्ट्रीम का इस्तेमाल किया जा सकता है. DASH के साथ काम करने वाले प्लेयर को सेट अप करते समय, आपको अपने वीडियो प्लेयर के प्रोग्रेस इवेंट के लिए एक लिसनर सेट अप करना होगा. इससे StreamManager.processMetadata() को वीडियो का मेटाडेटा मिल सकता है.
यह फ़ंक्शन तीन पैरामीटर लेता है:
type: यह एक स्ट्रिंग है, जिसे एचएलएस स्ट्रीम के लिए'ID3'और DASH स्ट्रीम के लिए'urn:google:dai:2018'पर सेट किया जाना चाहिए.data: DASH इवेंट मैसेज के लिए, यह मैसेज डेटा स्ट्रिंग है.timestamp: यह एक नंबर होता है, जो DASH स्ट्रीम के लिए इवेंट मैसेज शुरू होने का समय होता है.
जब भी आपके प्लेयर इवेंट से मेटाडेटा मिलता हो, उसे तुरंत और जितनी बार हो सके उतनी बार भेजें. अगर मेटाडेटा मौजूद नहीं है या गलत है, तो हो सकता है कि IMA DAI SDK टूल, विज्ञापन इवेंट को ट्रिगर न करे. इससे, विज्ञापन इवेंट की गलत रिपोर्टिंग हो सकती है.
HTML5 के लिए IMA डीएआई के उदाहरण डाउनलोड करें और hls_js/simple सैंपल ZIP फ़ाइल को एक नए फ़ोल्डर में निकालें. यह उदाहरण एक वेब ऐप्लिकेशन है, जिसे टेस्टिंग के लिए लोकल तौर पर होस्ट किया जा सकता है.
उदाहरण को स्थानीय तौर पर होस्ट करने के लिए, नए फ़ोल्डर पर जाएं और वेब सर्वर शुरू करने के लिए, Python का यह कमांड चलाएं:
python3 -m http.server 8000
http.server सिर्फ़ Python 3.x में उपलब्ध है. Apache HTTP Server या Node JS जैसे किसी भी दूसरे वेब सर्वर का इस्तेमाल किया जा सकता है.
वीडियो प्लेयर देखने के लिए, कोई वेब ब्राउज़र खोलें और localhost:8000 पर जाएं.
आपके ब्राउज़र में HLS.js लाइब्रेरी काम करती हो.
अगर सब कुछ ठीक से काम कर रहा है, तो वीडियो प्लेयर पर चलाएं बटन पर क्लिक करने से, शॉर्ट फ़िल्म "Tears of Steel" शुरू हो जाएगी. इसमें हर 30 सेकंड के अंतराल पर विज्ञापन दिखेंगे.
वीओडी स्ट्रीम का अनुरोध करना
सैंपल स्ट्रीम को विज्ञापन के साथ जोड़ी गई वीओडी स्ट्रीम से बदलने के लिए, Google Ad Manager की मदद से विज्ञापन सेशन अपने-आप बनाने के लिए, VideoStitcherVodStreamRequest क्लास का इस्तेमाल करें. निगरानी और डीबग करने के लिए, जनरेट किए गए डीआई सेशन ढूंढने के लिए, Google Ad Manager यूज़र इंटरफ़ेस (यूआई) का इस्तेमाल किया जा सकता है.
मौजूदा सैंपल में, वीओडी स्ट्रीम या लाइव स्ट्रीम का अनुरोध करने के लिए फ़ंक्शन मौजूद हैं. इसे Google Cloud Video Stitcher API के साथ काम करने के लिए, आपको VideoStitcherVodStreamRequest ऑब्जेक्ट दिखाने के लिए एक नया फ़ंक्शन जोड़ना होगा.
यहां एक उदाहरण दिया गया है:
// StreamManager which will be used to request DAI streams.
let streamManager;
...
function initPlayer() {
videoElement = document.getElementById('video');
adUiElement = document.getElementById('adUi');
streamManager = new google.ima.dai.api.StreamManager(
videoElement,
adUiElement
);
streamManager.addEventListener(
[
google.ima.dai.api.StreamEvent.Type.LOADED,
google.ima.dai.api.StreamEvent.Type.ERROR,
google.ima.dai.api.StreamEvent.Type.AD_BREAK_STARTED,
google.ima.dai.api.StreamEvent.Type.AD_BREAK_ENDED
],
onStreamEvent, false);
hls.on(Hls.Events.FRAG_PARSING_METADATA, function(event, data) {
if (streamManager && data) {
// For each ID3 tag in our metadata, we pass in the type - ID3, the
// tag data (a byte array), and the presentation timestamp (PTS).
data.samples.forEach(function(sample) {
streamManager.processMetadata('ID3', sample.data, sample.pts);
});
}
});
videoElement.addEventListener('pause', () => {
playButton.style.display = "block";
});
playButton.addEventListener('click', initiatePlayback);
}
function initiatePlayback() {
requestVodVideoStitcherStream();
playButton.style.display = "none";
playButton.removeEventListener('click', initiatePlayback);
playButton.addEventListener('click', resumePlayback);
}
...
function requestVodVideoStitcherStream() {
const streamRequest = new google.ima.dai.api.VideoStitcherVodStreamRequest();
streamRequest.vodConfigId = 'VOD_CONFIG_ID';
streamRequest.region = 'LOCATION';
streamRequest.projectNumber = 'PROJECT_NUMBER';
streamRequest.oAuthToken = 'OAUTH_TOKEN';
streamRequest.networkCode = 'NETWORK_CODE';
streamManager.requestStream(streamRequest);
}
पेज को फिर से लोड करें. इसके बाद, कस्टम वीओडी स्ट्रीम का अनुरोध किया जा सकता है और उसे चलाया जा सकता है.
(ज़रूरी नहीं) स्ट्रीमिंग सेशन के विकल्प जोड़ना
VideoStitcherVodStreamRequest.videoStitcherSessionOptions का इस्तेमाल करके, Cloud Video Stitcher API के डिफ़ॉल्ट कॉन्फ़िगरेशन को बदलने के लिए, सेशन के विकल्प जोड़कर स्ट्रीम के अनुरोध को पसंद के मुताबिक बनाएं.
अगर कोई ऐसा विकल्प दिया जाता है जिसकी पहचान नहीं की जा सकती, तो Cloud Video Stitcher API, एचटीटीपी 400 गड़बड़ी का कोड दिखाएगा. सहायता पाने के लिए, समस्या हल करने की गाइड देखें.
उदाहरण के लिए, नीचे दिए गए कोड स्निपेट की मदद से, मेनिफ़ेस्ट के विकल्पों को बदला जा सकता है. यह स्निपेट, सबसे कम बिटरेट से सबसे ज़्यादा बिटरेट तक के क्रम में, दो स्ट्रीम मेनिफ़ेस्ट के लिए अनुरोध करता है.
...
// The following session options are examples. Use session options
// that are compatible with your video stream.
streamRequest.videoStitcherSessionOptions = {
"manifestOptions": {
"includeRenditions": [
{"bitrateBps": 3000, "codecs": "hvc1.1.4.L126.B0, mp4a.40.2"},
{"bitrateBps": 2000, "codecs": "avc1.64001f, mp4a.40.2"},
],
"bitrateOrder": "ascending"
}
};
streamManager.requestStream(streamRequest);
व्यवस्थित करें
Google Cloud Video Stitcher API का इस्तेमाल करके, वीओडी स्ट्रीम को होस्ट करने और HTML5 के लिए IMA DAI SDK टूल का इस्तेमाल करके अनुरोध करने के बाद, वीडियो दिखाने से जुड़े सभी संसाधनों को हटाना ज़रूरी है.
ज़रूरत न पड़ने वाले संसाधनों और ऐसेट को हटाने के लिए, वीओडी क्लीन अप की गाइड का पालन करें.
आखिर में, उस टर्मिनल विंडो में जहां आपने Python 3 वेब सर्वर शुरू किया था, लोकल सर्वर को बंद करने के लिए कमांड ctrl+C का इस्तेमाल करें.