DEV Community

yqqwe
yqqwe

Posted on

Naver Video Akışını Çözümlemek: HLS Analizi ve WebAssembly ile Tarayıcı Tabanlı Video İşleme

Modern web ekosisteminde video indirmek, genellikle bir .mp4 dosyasına GET isteği atmaktan çok daha karmaşıktır. Naver gibi dev platformlar, bant genişliğini optimize etmek ve kullanıcı deneyimini artırmak için Adaptive Bitrate Streaming (ABS) teknolojilerini kullanır.
Naver Video Downloader projesini geliştirirken, Naver’ın kullandığı karmaşık veri yapılarını, dinamik imza doğrulama süreçlerini ve tarayıcı tabanlı kısıtlamaları nasıl aştığımızı teknik detaylarıyla bu makalede inceliyoruz.

1. Temel Sorun: Naver Videoları Neden Doğrudan İndirilemez?

Naver, videolarını sunmak için HLS (HTTP Live Streaming) protokolünü kullanır. HLS, bir videoyu tek bir dosya olarak sunmak yerine, onu yüzlerce küçük segmente böler.
HLS Mimarisi ve M3U8 Dosyaları
Naver'ın video oynatıcısı bir videoyu yüklediğinde, aslında şu hiyerarşiyi takip eder:

  1. Master Playlist (.m3u8): Farklı çözünürlüklerin (1080p, 720p, vb.) listesini içerir.
  2. Media Playlist: Belirli bir çözünürlükteki video parçalarının (genellikle .ts uzantılı) adreslerini içeren alt dosyadır.
  3. Video Segmentleri: Genellikle 2-5 saniye uzunluğundaki asıl video verileridir. Mühendislik Zorluğu: Bir downloader'ın görevi, bu yüzlerce parçayı doğru sırayla yakalamak, indirmek ve tek bir .mp4 dosyası haline getirmektir.

2. Naver Metadata Yapısının Tersine Mühendisliği (Reverse Engineering)

Süreci otomatize etmek için öncelikle videonun "Manifest" dosyasına, yani video parçalarının haritasına ulaşmamız gerekir.
API Handshake ve VodSeed Mekanizması
Naver'ın iç API'si (vod_play_info gibi), bir videoyu oynatmak için vid ve inkey parametrelerine ihtiyaç duyar. Bu anahtarlar genellikle JavaScript katmanında dinamik olarak oluşturulur ve kısa bir ömre (TTL) sahiptir. Doğru imza (signature) olmadan bir segmente erişmeye çalışmak 403 Forbidden hatasıyla sonuçlanır.
Geliştirdiğimiz motor, Naver oynatıcısının el sıkışma (handshake) sürecini emüle ederek en yüksek bit hızına sahip M3U8 kaynağını gerçek zamanlı olarak ayıklar.

3. Sistem Mimarisi: FFmpeg.wasm ile İstemci Tarafında Birleştirme

Geleneksel downloader'lar, video parçalarını bir sunucuya çeker, orada birleştirir ve ardından kullanıcıya sunar. Bu yöntem hem maliyetli hem de gizlilik açısından risklidir.
WebAssembly'nin Gücü
https://twittervideodownloaderx.com/naver_downloader_tu adresindeki aracımızda, ağır işlem yükünü kullanıcının tarayıcısına FFmpeg.wasm kullanarak devrettik.
• Kayıpsız Transmuxing: Videoyu yeniden kodlamadan (transcoding) sadece konteyner formatını değiştiriyoruz. -c copy bayrağını kullanarak TS parçalarını anında MP4'e dönüştürüyoruz.
• Gizlilik Odaklı Tasarım: Video verisi asla bizim sunucularımıza dokunmaz; birleştirme işlemi doğrudan kullanıcının RAM belleğinde gerçekleşir.

4. CORS (Cross-Origin Resource Sharing) Engelini Çözmek

Tarayıcı güvenlik politikaları (SOP), bir web sitesinin doğrudan Naver CDN'inden binary veri çekmesini engeller.
Şeffaf Proxy (Transparent Proxy) Çözümü
Bu engeli aşmak için Node.js tabanlı yüksek throughput'lu bir Streaming Proxy tasarladık:

  1. İstemci, segment URL'lerini bizim proxy'mize gönderir.
  2. Proxy, Naver CDN'inden gelen kısıtlayıcı CORS başlıklarını temizler.
  3. Proxy, Access-Control-Allow-Origin: * başlığını ekler.
  4. Veri, bir ReadableStream olarak istemciye iletilir. Bu sayede sunucumuzun bellek kullanımı sabit kalır ve veri depolanmaz.

5. Performans Optimasyonu: Asenkron Paralel İndirme

Bir HLS videosu yüzlerce küçük parçadan oluştuğu için bunları tek tek indirmek çok yavaştır. Projemizde bir Async Promise Pool yapısı kurduk:
JavaScript
// Paralel indirme mantığı örneği
async function paralelIndir(urls, limit) {
const sonuclar = [];
const havuz = new Set();
for (const url of urls) {
if (havuz.size >= limit) {
await Promise.race(havuz);
}
const islem = fetchSegment(url).then(data => {
havuz.delete(islem);
return data;
});
havuz.add(islem);
sonuclar.push(islem);
}
return Promise.all(sonuclar);
}
Bu paralelleştirme sayesinde indirme hızını platformun sınırlarına kadar zorlayabiliyoruz.

6. Sonuç: Kullanıcı Deneyimi İçin Mühendislik

Bir Naver downloader inşa etmek sadece linkleri "kazımak" değildir; modern web mimarisi, ağ protokolleri ve WebAssembly gibi teknolojilerin bir sentezidir. 1080p orijinal kaliteyi korurken hızı optimize etmek için her katmanda mühendislik kararları alınmıştır.
Hızlı, güvenli ve yüksek çözünürlüklü bir Naver video indirme deneyimi için çözümümüzü deneyebilirsiniz: 👉 Naver Video Downloader (Türkçe)
Teknik Öne Çıkanlar:
• Orijinal Kalite: Yeniden sıkıştırma yok; %100 orijinal bit akışı.
• WASM Gücü: Tarayıcı içinde yerel hızda işlem.
• Gizlilik: Verileriniz cihazınızda kalır.
Tarayıcı tabanlı medya işleme veya HLS protokolleri hakkında sorularınız varsa, yorumlarda tartışalım!
_
Etiketler: #javascript #webdev #nodejs #webassembly #ffmpeg #naver #streaming #turkce

Top comments (0)