👨‍👨‍👧‍👦 ㊗️ 🕜 एक ब्राउज़र में ffmpeg का उपयोग करके MP4 में HLS 👨🏾‍💼 🥡 👲🏾

नमस्कार! दो महीने से अधिक समय से, अपने खाली समय में मैं एचएमएसएस और डीएएस को एमपीईजी में बदलने के लिए एक वेब एप्लिकेशन देख रहा हूं, जिसमें ईस्मैप्टेन और एफएफएमपीपी का उपयोग किया गया है, जिससे मैं साझा करना चाहता हूं कि मैं यह कैसे करने में कामयाब रहा।

इस लेख में मैं ffmpeg के संपादन और पैच के स्रोत कोड का उल्लेख नहीं करूंगा उनमें से ज्यादातर मेरे घुटने पर किए गए थे, और मैं सी पर बहुत अच्छा नहीं हूं। लेकिन अब आपकी मदद करने के लिए पर्याप्त लेख हैं।

परिचय

दो साल पहले मुझे एक ऑडियो और वीडियो ट्रैक को एक साथ एक mp4 फ़ाइल में संयोजित करने का लक्ष्य था। तब मैं सिर्फ ईम्स्क्रिप्ट में डूब गया और मूलभूत बातों के लिए मुझे ffmpeg.js रिपॉजिटरी मिली जिसमें से मैंने बहुत कुछ सीखा। तब मैं लगभग लक्ष्य प्राप्त करने में सक्षम था, हालांकि मैं सी में बहुत सशर्त रूप से उन्मुख था।
स्रोत कोड को समझते हुए, ffmpeg ने फाइल सिस्टम के साथ काम करने के लिए एक पैच बनाया, जहां एक फाइल से पढ़ने से js में एक एसिंक्रोनस फ़ंक्शन होता था, जहां से फाइल के ब्लॉब को पढ़ा जाता था और बफर को स्थानांतरित किया जाता था, और जब लेखन कहा जाता था। js फ़ंक्शन जो रिपॉजिटरी को बफर डेटा भेजता है।

लेकिन एसिंक्रोनस फ़ंक्शंस के साथ एक समस्या थी, जिसे मैं सही तरीके से हल नहीं कर सका, उन्होंने asyncify (fastcomp) के माध्यम से काम किया, जो कुछ मामलों में सही तरीके से काम नहीं करता था, अर्थात्, wasm में कोड का निष्पादन बंद नहीं हुआ, js फ़ंक्शन के परिणाम की प्रतीक्षा किए बिना, यह सब है। टूट गया। इस समस्या को EMTERPRETIFY_WHITELIST ध्वज के माध्यम से तय किया गया था, जिसने स्पष्ट रूप से कोड को उसी समय से asm में स्थानांतरित कर दिया था और इसे धीमा कर दिया था, और कॉल स्टैक को डीबग करना और प्रत्येक अपवाद के साथ सूची में एक टूटी फ़ंक्शन जोड़ना आवश्यक था।

सामान्य तौर पर, ऐसी समस्याओं के साथ, इसे एक कामकाजी समाधान नहीं कहा जा सकता है, जिस पर यह सब एक छोटा डेमो बना रहा।

डेढ़ साल बाद

WebAssambly में नई सुविधाओं के बारे में Google देव शिखर सम्मेलन में एक रिपोर्ट देखने के बाद , मैं यह देखने के लिए गया कि एम्सस्क्रिप्ट कैसे कर रहा था और उसने एक संदेश देखा:

Emscripten संस्करण 1.39.0 (अक्टूबर 2019) के बाद से अपस्ट्रीम LLVM बैकएंड का उपयोग करके WebAssembly का उत्सर्जन करता है, और पुराने फास्टकैप बैकएंड को हटा दिया जाता है

मैं अपने प्रतिनिधि प्रारूप के पुनर्निर्माण की कोशिश करना चाहता था। लगभग एक सप्ताह मैंने नई संकलन समस्याओं को ठीक करने का तरीका जाना और अंत में इसे एक साथ रखा। ये बदलाव बहुत सारे नहीं थे, लेकिन यह पुस्तकालयों के नए लिंकर के कारण नहीं जा रहा था, और पहले से ही कम से कम कुछ इकट्ठा करने के लिए बेताब था, मैंने सिर्फ समस्या पुस्तकालयों को देखा (जैसा कि यह निकला, पुस्तकालय खुद जुड़े हुए हैं और आपको अब उन्हें विधानसभा के दौरान हाथ से इंगित करने की आवश्यकता नहीं है)।

और अब, वह क्षण आ गया है जब इसे इकट्ठा करके अर्जित किया गया है! एसिंक्रोनस कोड के साथ समस्या चली गई थी, कुछ भी डिबग करने की आवश्यकता नहीं थी, यह शुरुआत से ही काम करना चाहिए।

यहां मुझे लगता है कि मैं अपने लक्ष्य तक पहुंच गया हूं, लेकिन ... एक नया दिखाई दिया।

HTTP प्रोटोकॉल को फिर से लिखें

इस तरह के एक विचार लंबे समय से मँडरा रहा है। यह आपको एचएलएस या डीएएसएच डाउनलोड करने की अनुमति दे सकता है, और न केवल एक तैयार की गई प्लेलिस्ट, बल्कि एक लाइव स्ट्रीम भी कर सकता है। और मैंने इंटरनेट पर ऐसा कभी नहीं देखा।

मुझे कम से कम कुछ समय के लिए काम करने में लगभग तीन सप्ताह का समय लगा। मुझे पता था कि सी (शून्य अनुभव होने के दौरान), पॉइंटर्स के साथ बहुत सारी समस्याएं थीं (यह कहाँ जाता है, और यहां तक कि किसी और के कोड में भी नज़र रखना मुश्किल है), लेकिन आख़िरकार कुछ त्रुटियों के बिना संकलित किया गया था। पहली सफलताओं के बाद, इस विचार को पूरा करने के लिए और भी अधिक उत्साह मिला।

बस कुछ हफ़्ते, और अंत में मैं काम कर रहे http प्रोटोकॉल का पहला पुनरावृत्ति करने में कामयाब रहा, और यह सब प्रतीत होगा?

जब सबसे कठिन है

इस बिंदु पर, मेरे पास एक रूपरेखा तैयार थी, एक यूआरएल इनपुट फ़ील्ड और एक स्टार्ट बटन के साथ एक छोटा एचटीएमएल रूप, मूल रूप से यह काम करता था। लेकिन यह अभी भी आवश्यक था कि कोर को बायपास करने के लिए एक एक्सटेंशन लिखा जाए और डेटा लोड किया जाए, एक स्टोरेज बनाया जाए जो डेटा को चंक्स में लिखे, प्रगति प्रदर्शन के साथ एक इंटरफ़ेस बनाये, यह सब अलग-अलग ब्राउज़रों में समस्याओं को ठीक करने के लिए डीबग किया गया था। सामान्य तौर पर, इसका उपयोग करने के लिए आखिरकार संभव हो गया है।

मूल रूप से, उपयोगकर्तास्क्रिप्ट बनाया गया था, जो डेटा डाउनलोड करने के लिए ffmpeg से अनुरोध प्राप्त करने के लिए एक प्रॉक्सी था।

कुछ दिनों बाद, क्रोम और फ़ायरफ़ॉक्स के लिए एक एक्सटेंशन तैयार हो गया, जिसने वेबरपेस्ट का उपयोग करते हुए उन सभी हल्स लिंक को एकत्र किया, जो वीडियो देखते समय ब्राउज़र लोड करता है।

फ़ायरफ़ॉक्स में, जैसा कि यह निकला, एक्सटेंशन एपीआई आपको शक्ति का प्रबंधन करने की अनुमति नहीं देता है, जिससे आप कंप्यूटर को सो जाने से नहीं रोक सकते हैं, अफसोस।

विस्तार इस तरह दिखता है:

बस उस पृष्ठ को बेहतर बनाया जिस पर साइट थोड़ी-सी खराब थी, सामग्री-यूआई को, उन सभी स्थानों को अंतिम रूप दिया गया था, जिन्हें कोड़ा मार दिया गया था।

डेटा संग्रहीत करने के विभिन्न तरीकों का परीक्षण करने के बाद, मैंने कई समस्याओं का खुलासा किया:

ब्लॉब - क्रोम उन्हें रैम पर लिखता है और ओवरफ्लो होने पर डिस्क पर ड्रॉप करता है, लेकिन केवल ओएसएक्स में जब मेमोरी ओवरफ्लो होती है, तो ओएस खाता छोड़ देता है और खुले हुए सभी एप्लिकेशन को बंद कर देता है। और फ़ायरफ़ॉक्स आम तौर पर हमेशा मेमोरी में डेटा रखते थे।

कैश स्टोरेज- यह IndexedDb की तरह काम करता है, लेकिन डेटा लिखने के बाद, क्रोम ब्लॉब में वे RAM (या तो बग या फिटाचा) में रहते हैं, लेकिन यह पता चलता है कि डेटा कैश स्टोरेज (डिस्क पर) में लिखा जाता है और मेमोरी के फुल होने पर इसे भी ड्राप कर देता है बूँद के रूप में डिस्क की मात्रा।

IndexedDb - एक घड़ी की तरह काम करता है, जानता है कि बूँद को कैसे स्टोर किया जाता है, बिना तामझाम के डेटा लिखते हैं, लेकिन फ़ायरफ़ॉक्स सख्ती से 2 जीबी की मात्रा को सीमित करता है।

मैंने इस पर थोड़ा काम किया, मैं ffmpeg प्रक्रिया (एक सूचक के माध्यम से) को बाधित करने का कार्य करने में कामयाब रहा, मैं प्रारूपों (ffprobe) और नेटवर्क त्रुटियों से निपटने का विकल्प कैसे बनाऊं।

और अब, आप परिणाम को स्वयं यहां आज़मा सकते हैं

मेरे लिए, यह एक अनिवार्य बात है जब आपको किसी ट्वीट पर स्ट्रीम रिकॉर्ड करने या VOD डाउनलोड करने की आवश्यकता होती है। यह एक लैपटॉप, मिक्सर, और किसी भी अन्य साइटों के साथ काम करता है जो एचएलएस या डीएएचएस (अफसोस, डीएफएस कार्यान्वयन में सामग्री को प्रसारित करता है) बहुत सशर्त है और लाइव सही तरीके से डाउनलोड नहीं हो सकता है, क्योंकि यह खंड के अंतराल को ध्यान में नहीं रखता है)।

पढ़ने के लिए धन्यवाद!

यदि आपके पास ffmpeg और emscripten के बारे में प्रश्न हैं - लिखिए, तो मैं उत्तर देने का प्रयास करूंगा।

एक ब्राउज़र में ffmpeg का उपयोग करके MP4 में HLS

परिचय

डेढ़ साल बाद

HTTP प्रोटोकॉल को फिर से लिखें

जब सबसे कठिन है

More articles: