Takip et

YouTube Transkriptlerini Toplu Çıkaran Chrome Eklentisi Nasıl Yapılır?

YouTube videolarından transkriptleri tek tek kopyalamak zaman alıcı ve zahmetli bir süreçtir. Peki ya yüzlerce videonun transkriptini sadece birkaç tıklamayla toplu olarak çıkarabilseydik? Bu makale, içerik üreticileri, araştırmacılar ve veri analistleri için oyunun kurallarını değiştirecek, YouTube transkriptlerini toplu bir şekilde elde etmenizi sağlayacak bir Chrome eklentisi geliştirme sürecini adım adım açıklıyor.

Günümüz dijital dünyasında, video içerikleri bilginin ana akışını oluşturuyor. YouTube, bu devasa bilgi okyanusunun merkezinde yer alıyor. Ancak, bu içeriklerden anlamlı veriler çıkarmak, özellikle de metin tabanlı analizler yapmak istediğimizde, önemli bir zorlukla karşılaşıyoruz: videoların transkriptlerine erişim. Her ne kadar YouTube, otomatik altyazı veya yükleyici tarafından sağlanan altyazı seçenekleri sunsa da, bu transkriptleri manuel olarak kopyalayıp yapıştırmak, özellikle büyük ölçekli projelerde imkansız denecek kadar verimsizdir. İşte tam bu noktada, toplu transkript çıkarma ihtiyacı ortaya çıkıyor.

Bu ihtiyaç, farklı profesyonel gruplar için çeşitli senaryolarda kendini gösterir. Örneğin, bir pazarlamacı rakip analizleri yaparken, belirli bir sektördeki popüler videoların anahtar kelime yoğunluğunu veya konuşma tonunu incelemek isteyebilir. Elbette, bu analizler için her videonun transkriptini tek tek çıkarmak yerine, yüzlerce videonun metinsel içeriğini anında elde etmek, büyük bir zaman tasarrufu sağlar. Dahası, SEO uzmanları için transkriptler, video içeriklerinin arama motorları tarafından daha iyi indekslenmesine yardımcı olacak potansiyel anahtar kelimeleri ve konu başlıklarını belirlemede altın değerindedir. Videoların metin tabanlı içeriklerini inceleyerek, popüler konuları, sıkça kullanılan terimleri ve hedef kitlenin ilgi alanlarını çok daha hızlı bir şekilde tespit edebilirler. Bu da, hem kendi içerik stratejilerini geliştirmelerine hem de rakip stratejilerini anlamalarına olanak tanır.

Akademisyenler ve araştırmacılar için ise toplu transkriptler, büyük veri setleri üzerinde metin madenciliği ve duygu analizi yapma potansiyeli sunar. Örneğin, belirli bir sosyal konuyu ele alan binlerce videonun transkriptlerini analiz ederek kamuoyunun genel eğilimlerini veya farklı perspektifleri derinlemesine inceleyebilirler. Bu tür analizler, geleneksel manuel yöntemlerle mümkün olmayan kapsamlı içgörüler sağlar. Podcast yayıncıları veya içerik üreticileri de kendi içeriklerini farklı platformlarda metin olarak yayınlamak, blog yazıları oluşturmak veya erişilebilirlik amacıyla metin versiyonlarını sunmak için bu eklentiyi kullanabilirler. Böylece içeriklerini daha geniş kitlelere ulaştırabilir ve SEO performanslarını artırabilirler. Sonuç olarak, toplu YouTube transkriptleri çıkarma yeteneği, sadece bir kolaylık değil, aynı zamanda dijital içerik analizi, pazarlama ve araştırma alanlarında stratejik bir araç haline gelmiştir. Bu makale, bu güçlü aracı nasıl geliştireceğinizi adım adım gösterecektir.

Bir Chrome Eklentisi Geliştirmeye Nereden Başlamalıyım?

Bir Chrome eklentisi geliştirmeye karar verdiğinizde, başlangıç noktası genellikle aynıdır: Google’ın belirlediği standartlar ve mimari prensipler. Modern Chrome eklentileri, Manifest V3 adını verdiğimiz yeni bir mimari üzerinde çalışır. Manifest V3, güvenlik, performans ve gizlilik odaklı iyileştirmeler sunarak, eklentilerin daha sağlam ve kullanıcı dostu olmasını hedefler. Bu bölüm, Manifest V3’ün temel bileşenlerini ve eklentimizin YouTube transkriptlerini toplu olarak çekmek için nasıl bir araya geleceğini açıklayacaktır.

Öncelikle, her Chrome eklentisinin bir manifest.json dosyasına ihtiyacı vardır. Bu dosya, eklentinizin kimlik kartı gibidir; adı, sürümü, izinleri ve hangi komut dosyalarını nerede çalıştıracağını tanımlar. Manifest V3 ile birlikte gelen en büyük değişikliklerden biri, arka plan sayfalarının yerini Service Worker’ların almasıdır. Service Worker’lar, eklentinizin arka planında çalışan, tarayıcı olaylarını dinleyen ve uzun süreli görevleri yerine getiren JavaScript kodlarıdır. Bir videonun transkriptini toplama veya birden fazla video arasında geçiş yapma gibi işlemler, genellikle Service Worker üzerinden yönetilir. Bu sayede, eklentiniz yalnızca ihtiyaç duyulduğunda kaynak tüketir ve genel tarayıcı performansını olumsuz etkilemez. Ayrıca, Service Worker’lar sayesinde eklentiniz tarayıcı kapatıldığında bile belirli görevleri yerine getirmeye devam edebilir, bu da toplu işlemler için kritik bir özelliktir.

Diğer bir önemli bileşen ise Content Script’lerdir. Content Script’ler, web sayfalarının içeriğiyle doğrudan etkileşime giren JavaScript dosyalarıdır. YouTube transkriptlerini çıkarmak için, eklentimizin YouTube sayfasına bir Content Script enjekte etmesi gerekecektir. Bu script, sayfanın DOM yapısını inceleyecek, transkriptlerin bulunduğu elementleri bulacak ve bu metinleri Service Worker’a iletecektir. Content Script’ler, web sayfalarına adeta “eklenti gözü” katarak, bizim belirlediğimiz kurallar çerçevesinde sayfa içeriğini okumamızı ve hatta değiştirmemizi sağlar. Bu doğrudan etkileşim, YouTube’un altyazı mekanizmasından yararlanarak transkript verilerini güvenilir bir şekilde almamız için elzemdir.

Son olarak, eklentimizin kullanıcıyla etkileşim kurmasını sağlayan bir Popup arayüzü olacaktır. Tarayıcı çubuğundaki eklenti simgesine tıklandığında açılan küçük bir pencere olan popup, kullanıcının transkriptleri hangi formatta almak istediğini seçmesi, belirli bir video listesini girmesi veya toplu çıkarma işlemini başlatması için bir arayüz sunar. Bu arayüz, genellikle HTML, CSS ve JavaScript (popup.html ve popup.js) kullanılarak geliştirilir. Popup, kullanıcıdan gelen girdileri Service Worker’a ileterek, karmaşık işlemleri tetikler ve kullanıcının eklentiyle sezgisel bir şekilde etkileşim kurmasını sağlar. Tüm bu bileşenler, Manifest V3’ün getirdiği yeni API’ler ve güvenlik modelleriyle uyumlu bir şekilde çalışarak, YouTube transkriptlerini toplu olarak çekmek için güçlü ve verimli bir altyapı oluşturur. Şimdi, bu teorik bilgileri pratiğe dökelim ve eklentimizin kodunu yazmaya başlayalım.

Adım Adım Geliştirme: YouTube Transkript Toplayıcı Eklentimizi Oluşturalım mı?

Şimdi teoriden pratiğe geçme zamanı. YouTube transkriptlerini toplu olarak çekecek Chrome eklentimizi adım adım oluşturacağız. Bu bölümde, projemizin temel yapısından başlayarak, eklentinin her bir ana bileşenini (manifest, service worker, content script ve popup) nasıl kodlayacağımızı detaylıca inceleyeceğiz. Her bir adımda, ilgili kod bloklarını (

...

) ve bunların ne işe yaradığını açıklayarak, okuyucunun konuyu sıfırdan anlayabileceği bir yol haritası sunacağız. Proje yapısı, modern bir Chrome eklentisi için en uygun mimariyi yansıtacak şekilde tasarlanmıştır, bu da ilerideki geliştirmeleri ve bakımı kolaylaştıracaktır. Ayrıca, YouTube’un dinamik yapısını göz önünde bulundurarak, transkript verilerine güvenilir bir şekilde nasıl erişileceğine dair pratik yaklaşımlar da ele alınacaktır. Bu sayede, sadece kod yazmakla kalmayacak, aynı zamanda eklentinin ardındaki mantığı ve tasarım prensiplerini de kavramış olacaksınız.

İlk olarak, projemizin dosya yapısını oluşturalım. Temiz ve düzenli bir yapı, eklentinin geliştirme sürecini önemli ölçüde hızlandırır ve hataları minimize eder. Aşağıdaki gibi bir dizin yapısı, tipik bir Chrome eklentisi için iyi bir başlangıç noktasıdır:


    youtube-transcript-extractor/
    ├── manifest.json
    ├── service-worker.js
    ├── content-script.js
    ├── popup.html
    ├── popup.js
    └── icons/
        ├── icon16.png
        ├── icon48.png
        └── icon128.png
    

Bu yapı, eklentinin tüm temel bileşenlerini ayrı dosyalarda tutmamızı sağlar, bu da modülerlik ve okunabilirlik açısından kritik öneme sahiptir. Şimdi, her bir bileşenin detaylarına inelim.

Proje Yapısı ve manifest.json: Eklentinin Kimlik Kartı Nasıl Hazırlanır?

Her Chrome eklentisinin kalbi, manifest.json dosyasıdır. Bu dosya, eklentinizin meta verilerini, izinlerini ve hangi script'lerin ne zaman ve nerede çalışacağını tanımlar. Manifest V3 ile birlikte, bazı izinler ve deklarasyonlar değişti. Bizim eklentimiz için gerekli olan temel manifest.json içeriği şu şekilde olacaktır:


    {
      "manifest_version": 3,
      "name": "YouTube Toplu Transkript Çıkarıcı",
      "version": "1.0",
      "description": "YouTube videolarının transkriptlerini toplu olarak çıkarır.",
      "icons": {
        "16": "icons/icon16.png",
        "48": "icons/icon48.png",
        "128": "icons/icon128.png"
      },
      "action": {
        "default_popup": "popup.html",
        "default_icon": {
          "16": "icons/icon16.png",
          "24": "icons/icon24.png",
          "32": "icons/icon32.png"
        }
      },
      "permissions": [
        "activeTab",
        "storage",
        "scripting"
      ],
      "host_permissions": [
        "*://*.youtube.com/*"
      ],
      "background": {
        "service_worker": "service-worker.js"
      }
    }
    

Bu manifest dosyasında dikkat etmemiz gereken birkaç önemli nokta var:

  • "manifest_version": 3: Manifest V3 kullandığımızı belirtir.
  • "name", "version", "description": Eklentinizin temel bilgileri.
  • "icons": Eklentinizin farklı boyutlardaki ikonları. Kullanıcı arayüzünde ve Chrome Web Mağazası'nda görünür.
  • "action": Eklenti simgesine tıklandığında ne olacağını tanımlar. Burada, popup.html dosyasının bir popup olarak açılacağını belirtiyoruz.
  • "permissions": Eklentinizin ihtiyaç duyduğu API erişimlerini listeler.
    • "activeTab": Kullanıcının o an aktif olan sekmesine geçici erişim sağlar.
    • "storage": Eklentinin kullanıcı verilerini (örn. ayarları) saklamasına izin verir.
    • "scripting": Belirli bir web sayfasına kod enjekte etme veya o sayfada kod çalıştırma yeteneği verir. Bu, Content Script'imizi çalıştırmak için gereklidir.
  • "host_permissions": Eklentinin hangi web siteleriyle etkileşime girebileceğini belirtir. "*://*.youtube.com/*" ile YouTube'un tüm alt alan adlarında çalışabileceğimizi beyan ederiz.
  • "background": Service Worker'ımızın dosya yolunu (service-worker.js) belirtir. Manifest V3'te arka plan sayfaları yerine Service Worker'lar kullanılır.

Bu manifest.json dosyası, eklentimizin temel işlevselliği için gerekli olan tüm yapılandırmaları içerir. Şimdi, eklentinin arka planında çalışan beyin olan Service Worker'a geçelim.

Arka Plan Betiği (Service Worker): Veri Toplama Mantığını Nasıl Yönetiriz?

service-worker.js dosyası, eklentimizin arka planda çalışan ve çeşitli olayları dinleyip bunlara tepki veren ana kontrol mekanizmasıdır. Bu dosya, popup'tan gelen talepleri alır, YouTube sayfasına Content Script'i enjekte eder ve Content Script'ten gelen transkript verilerini işler. Service Worker, ayrıca toplu çıkarma mantığını da yönetecek ve kullanıcıya geri bildirim sağlayacaktır. İşte service-worker.js dosyamızın temel yapısı:


    // service-worker.js
    chrome.runtime.onMessage.addListener(async (request, sender, sendResponse) => {
        if (request.action === "extractTranscripts") {
            const videoIds = request.videoIds;
            const results = [];

            for (const videoId of videoIds) {
                try {
                    const videoUrl = https://www.youtube.com/watch?v=${videoId};
                    
                    // Yeni bir sekme açıyoruz
                    const tab = await chrome.tabs.create({ url: videoUrl, active: false });
                    
                    // Sekme yüklenene kadar bekliyoruz
                    await new Promise(resolve => {
                        chrome.tabs.onUpdated.addListener(function listener(tabId, changeInfo) {
                            if (tabId === tab.id && changeInfo.status === 'complete') {
                                chrome.tabs.onUpdated.removeListener(listener);
                                resolve();
                            }
                        });
                    });

                    // İçerik betiğini enjekte ediyoruz
                    const [response] = await chrome.scripting.executeScript({
                        target: { tabId: tab.id },
                        files: ['content-script.js']
                    });

                    // İçerik betiğine transkripti çekme talimatı gönderiyoruz
                    const [transcriptResponse] = await chrome.scripting.executeScript({
                        target: { tabId: tab.id },
                        function: () => {
                            // content-script.js içinde tanımlanan fonksiyonu çağır
                            return window.extractTranscript();
                        }
                    });

                    if (transcriptResponse && transcriptResponse.result) {
                        results.push({ videoId, transcript: transcriptResponse.result });
                    } else {
                        results.push({ videoId, transcript: "Transkript bulunamadı veya bir hata oluştu." });
                    }
                    
                    // Sekmeyi kapatıyoruz
                    await chrome.tabs.remove(tab.id);

                } catch (error) {
                    console.error(Video ${videoId} için transkript çekilirken hata:, error);
                    results.push({ videoId, transcript: Hata: ${error.message} });
                    // Hata durumunda açılan sekmeyi kapatmaya çalış
                    if (tab && tab.id) {
                        try {
                            await chrome.tabs.remove(tab.id);
                        } catch (e) {
                            console.error(Sekme kapatılırken hata:, e);
                        }
                    }
                }
            }
            sendResponse({ status: "success", data: results });
        }
        return true; // Asenkron yanıt için
    });

    // Opsiyonel: Eklenti yüklendiğinde veya güncellendiğinde çalışacak kod
    chrome.runtime.onInstalled.addListener(() => {
        console.log("YouTube Toplu Transkript Çıkarıcı yüklendi!");
    });
    

Uzman İpucu: Service Worker'lar, kısa ömürlü olma eğilimindedir. Yani, işleri bittiğinde Chrome onları sonlandırabilir. Bu nedenle, uzun süreli işlemler (örneğin çok sayıda video için transkript çekme) yaparken, her bir adımın bağımsız olduğundan ve Service Worker'ın aniden sonlandırılmasına karşı dirençli olduğundan emin olun. Bu örnekte, her video için yeni bir sekme açıp kapatarak bu durumu yönetiyoruz.

Bu kod bloğunda neler oluyor?

  • chrome.runtime.onMessage.addListener: Popup veya Content Script'ten gelen mesajları dinler. "extractTranscripts" aksiyonu geldiğinde çalışır.
  • videoIds: Popup'tan gelen video ID'lerinin listesi.
  • chrome.tabs.create: Her bir video ID'si için yeni bir sekme açarız. active: false ile bu sekmelerin arka planda açılmasını sağlarız, böylece kullanıcının deneyimi kesintiye uğramaz.
  • chrome.tabs.onUpdated.addListener: Sekmenin tamamen yüklendiğinden emin olmak için bekleriz. Bu kritik bir adımdır, çünkü Content Script'i enjekte etmeden önce sayfanın hazır olması gerekir.
  • chrome.scripting.executeScript: Manifest V3 ile birlikte, Content Script'ler doğrudan Service Worker'dan enjekte edilir. İlk olarak content-script.js dosyasını enjekte ederiz. Ardından, bu script'in içinde tanımlanan extractTranscript() fonksiyonunu çağırarak transkripti çekmesini isteriz.
  • Transkript çekildikten sonra, açılan sekmeyi chrome.tabs.remove(tab.id) ile kapatırız. Bu, tarayıcının kaynak tüketimini optimize etmek için önemlidir.
  • Her video için sonuçları results dizisine ekler ve tüm işlemler tamamlandığında bu sonuçları popup'a geri göndeririz.
  • return true;: Asenkron bir yanıt göndereceğimizi belirtiriz, böylece dinleyici kanalını açık tutarız.

Bu Service Worker, eklentinin tüm operasyonel yükünü üstlenir. Şimdi, YouTube sayfasındaki transkript verilerini doğrudan çekmek için Content Script'e bakalım.

İçerik Betiği (Content Script): YouTube Sayfasıyla Nasıl Etkileşim Kurulur?

content-script.js, YouTube video sayfasında çalışacak ve transkript verilerini doğrudan DOM'dan alacak olan script'tir. YouTube'un transkript mekanizması, genellikle "Altyazılar" veya "Transkript" düğmesi tıklandığında açılan bir panelde bulunur. Bu script, bu paneli bulacak, açacak ve içeriğini okuyacaktır. İşte content-script.js dosyamızın içeriği:


    // content-script.js

    // Bu fonksiyonu global scope'ta tanımlıyoruz ki service worker çağırabilsin
    window.extractTranscript = async () => {
        try {
            // "Altyazılar" veya "Transkript" düğmesini bul ve tıkla
            // YouTube'un dilden dile değişen buton metinlerini desteklemek için
            const transcriptButtonSelectors = [
                'ytd-menu-renderer.ytd-watch-metadata tp-yt-paper-button.style-scope:has(yt-icon.ytd-menu-renderer[icon="yt-icons:subtitles"])', // Geniş ekran yeni UI
                'ytd-menu-renderer.ytd-watch-metadata button.yt-spec-button-shape-next[aria-label*="Transcript"]', // Daha yeni UI
                '#button.ytd-toggle-button-renderer:has(yt-icon-button[aria-label="Toggle transcript"])', // eski UI
                'button[aria-label*="Toggle transcript"]' // Genel arama
            ];

            let transcriptButton = null;
            for (const selector of transcriptButtonSelectors) {
                transcriptButton = document.querySelector(selector);
                if (transcriptButton) {
                    break;
                }
            }

            if (!transcriptButton) {
                console.warn("Transkript düğmesi bulunamadı. Alternatif yollar deneniyor...");
                // Belki doğrudan menu'ye erişip "Open transcript"i buluruz
                const menuButton = document.querySelector('ytd-menu-renderer #button');
                if (menuButton) {
                    menuButton.click();
                    await new Promise(r => setTimeout(r, 500)); // Menünün açılması için bekle
                    const openTranscriptItem = document.querySelector('yt-formatted-string.ytd-menu-navigation-item-renderer:has(yt-icon[icon="yt-icons:subtitles"])');
                    if (openTranscriptItem) {
                        openTranscriptItem.click();
                        console.log("Transkript menü öğesi tıklandı.");
                        await new Promise(r => setTimeout(r, 1000)); // Transkript panelinin yüklenmesi için bekle
                    } else {
                        console.warn("Menü açık, ancak 'Transkripti aç' öğesi bulunamadı.");
                        menuButton.click(); // Menüyü kapat
                    }
                }
                
                // Transkript butonu yine de bulunamazsa veya tıklanamazsa
                transcriptButton = document.querySelector('ytd-engagement-panel-section-list-renderer #header button[aria-label="Toggle transcript"]');
                if (transcriptButton) {
                     console.log("Alternatif transkript düğmesi bulundu.");
                } else {
                    console.error("Transkript düğmesi hiçbir şekilde bulunamadı.");
                    return "Transkript düğmesi bulunamadı.";
                }
            }
            
            // Eğer hala bir düğme varsa ve tıklanmamışsa tıkla
            if (transcriptButton && !transcriptButton.ariaPressed === 'true') { // Kontrol ekle: zaten açık mı?
                transcriptButton.click();
                console.log("Transkript düğmesi tıklandı.");
                await new Promise(r => setTimeout(r, 1000)); // Panel açılması için bekle
            }


            // Transkript panelini bul
            const transcriptPanel = document.querySelector('ytd-engagement-panel-section-list-renderer[target-id="engagement-panel-transcript"]');

            if (!transcriptPanel) {
                console.error("Transkript paneli bulunamadı.");
                return "Transkript paneli bulunamadı.";
            }

            // Transkript metinlerini içeren elemanları topla
            const transcriptElements = transcriptPanel.querySelectorAll('.segment-text'); // YouTube'un transkript segmentleri için kullandığı sınıf

            if (transcriptElements.length === 0) {
                // Eğer doğrudan segment-text yoksa, belki farklı bir yapıdadır
                const textNodes = transcriptPanel.querySelectorAll('div[data-time-ms] yt-formatted-string');
                if (textNodes.length > 0) {
                     const transcriptText = Array.from(textNodes).map(el => el.textContent.trim()).join('\n');
                     return transcriptText;
                }
                console.error("Transkript metin elementleri bulunamadı.");
                return "Transkript metin elementleri bulunamadı.";
            }

            // Metinleri birleştir
            const transcriptText = Array.from(transcriptElements).map(el => el.textContent.trim()).join('\n');
            console.log("Transkript başarıyla çekildi.");
            return transcriptText;

        } catch (error) {
            console.error("Transkript çekilirken bir hata oluştu:", error);
            return Transkript çekilirken bir hata oluştu: ${error.message};
        }
    };
    

Bu Content Script'in ana işlevleri:

  • window.extractTranscript = async () => {...}: Bu fonksiyonu global scope'a ekliyoruz, böylece Service Worker executeScript ile doğrudan çağırabilir.
  • Transkript Düğmesini Bulma ve Tıklama: YouTube'un arayüzü zaman zaman değiştiği için, birden fazla CSS seçici kullanarak "Altyazılar" veya "Transkript" düğmesini bulmaya çalışırız. Bulunduğunda, programatik olarak tıklayarak transkript panelini açarız. Eğer doğrudan düğme bulunamazsa, menü düğmesini açıp "Open transcript" öğesini bulmaya çalışırız.
  • await new Promise(r => setTimeout(r, X));: Bu satırlar, bir elemanın yüklenmesini veya bir animasyonun tamamlanmasını beklemek için kullanılan basit gecikme fonksiyonlarıdır. YouTube'un dinamik yapısında, elemanların hemen görünmeyebileceği durumlarda bu tür gecikmeler kritik olabilir.
  • Transkript Panelini Bulma: Düğmeye tıklandıktan sonra, transkriptlerin görüntülendiği ytd-engagement-panel-section-list-renderer[target-id="engagement-panel-transcript"] panelini buluruz.
  • Transkript Metinlerini Toplama: Panel bulunduktan sonra, içerisindeki metin segmentlerini (genellikle .segment-text sınıfına sahip elemanlar) seçer ve tüm metinleri birleştirerek bir string oluştururuz. Farklı YouTube yapıları için alternatif seçiciler de eklenmiştir.
  • Hata Yönetimi: Her adımda olası hataları yakalar ve konsola loglarız. Bu, sorun giderme için önemlidir.

Bu script, YouTube sayfasındaki karmaşık DOM yapısı içinde gezinerek istediğimiz veriyi çekme görevini üstlenir. Şimdi, kullanıcının eklentiyle etkileşim kurmasını sağlayacak popup arayüzünü oluşturalım.

Kullanıcı Arayüzü (Popup): Eklentimizi Kullanıcı Dostu Hale Nasıl Getiririz?

popup.html ve popup.js dosyaları, eklentimizin kullanıcı arayüzünü oluşturur. Kullanıcı, tarayıcıdaki eklenti simgesine tıkladığında bu popup penceresi açılır. Burada, kullanıcının YouTube video ID'lerini girmesi, transkriptleri çekme işlemini başlatması ve sonuçları görüntülemesi için gerekli bileşenleri sunarız.

popup.html:


    
    
    
        
        
        YouTube Transkript Çıkarıcı
        
        
    
    
        

YouTube Toplu Transkript Çıkarıcı

YouTube video ID'lerini (her satıra bir tane) veya tam URL'leri buraya yapıştırın.

İşlem bekleniyor...

Çekilen Transkriptler:

Sonuçlar burada görüntülenecektir.




popup.js:


    // popup.js
    document.addEventListener('DOMContentLoaded', () => {
        const videoIdsInput = document.getElementById('videoIdsInput');
        const extractButton = document.getElementById('extractButton');
        const statusDiv = document.getElementById('status');
        const transcriptOutput = document.getElementById('transcriptOutput');
        const copyAllButton = document.getElementById('copyAllButton');

        extractButton.addEventListener('click', async () => {
            const input = videoIdsInput.value.trim();
            if (!input) {
                statusDiv.textContent = 'Lütfen en az bir video ID\'si veya URL girin.';
                return;
            }

            extractButton.disabled = true;
            statusDiv.textContent = 'Transkriptler çekiliyor, lütfen bekleyin... Bu işlem birkaç saniye sürebilir.';
            transcriptOutput.textContent = '';
            copyAllButton.style.display = 'none';

            // Video ID'lerini temizle ve formatla
            const rawLines = input.split('\n').map(line => line.trim()).filter(line => line.length > 0);
            const videoIds = rawLines.map(line => {
                const urlMatch = line.match(/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/);
                return urlMatch ? urlMatch[1] : line; // Eğer URL ise ID'yi al, değilse olduğu gibi bırak
            }).filter(id => id.length === 11); // Sadece geçerli 11 karakterli ID'leri al

            if (videoIds.length === 0) {
                statusDiv.textContent = 'Geçerli video ID\'si veya URL bulunamadı.';
                extractButton.disabled = false;
                return;
            }

            try {
                // Service Worker'a mesaj gönder
                const response = await chrome.runtime.sendMessage({
                    action: "extractTranscripts",
                    videoIds: videoIds
                });

                if (response && response.status === "success") {
                    let fullTranscriptText = '';
                    if (response.data.length > 0) {
                        response.data.forEach(item => {
                            fullTranscriptText += Video ID: ${item.videoId}\n;
                            fullTranscriptText += Transkript:\n${item.transcript}\n\n;
                        });
                        transcriptOutput.textContent = fullTranscriptText;
                        statusDiv.textContent = Toplam ${response.data.length} videonun transkripti çekildi.;
                        copyAllButton.style.display = 'block';
                    } else {
                        statusDiv.textContent = 'Hiçbir transkript çekilemedi.';
                        transcriptOutput.textContent = 'Veri yok.';
                    }
                } else {
                    statusDiv.textContent = Hata oluştu: ${response ? response.error : 'Bilinmeyen Hata'};
                    transcriptOutput.textContent = 'Transkriptler alınamadı.';
                }
            } catch (error) {
                console.error("Popup'tan Service Worker'a mesaj gönderilirken hata:", error);
                statusDiv.textContent = İşlem sırasında bir hata oluştu: ${error.message};
                transcriptOutput.textContent = 'Hata.';
            } finally {
                extractButton.disabled = false;
            }
        });

        copyAllButton.addEventListener('click', () => {
            const textToCopy = transcriptOutput.textContent;
            navigator.clipboard.writeText(textToCopy).then(() => {
                const originalText = copyAllButton.textContent;
                copyAllButton.textContent = 'Kopyalandı!';
                setTimeout(() => {
                    copyAllButton.textContent = originalText;
                }, 1500);
            }).catch(err => {
                console.error('Kopyalama başarısız:', err);
                alert('Metni kopyalarken bir hata oluştu.');
            });
        });
    });
    

Popup arayüzü ve JavaScript kodunda şunlar önemlidir:

  • videoIdsInput: Kullanıcının video ID'lerini veya URL'lerini gireceği textarea.
  • extractButton: Transkript çıkarma işlemini başlatan düğme.
  • statusDiv: Kullanıcıya işlemin durumu hakkında bilgi veren alan.
  • transcriptOutput: Çekilen transkriptlerin gösterileceği pre etiketi.
  • copyAllButton: Tüm transkriptleri panoya kopyalamak için bir düğme.
  • Video ID'lerini Çıkarma: Kullanıcı hem ID'leri hem de tam URL'leri girebilir. Kod, düzenli ifadeler (regex) kullanarak URL'lerden video ID'lerini ayrıştırır.
  • chrome.runtime.sendMessage: Bu fonksiyon, popup'tan Service Worker'a bir mesaj göndererek "extractTranscripts" aksiyonunu tetikler.
  • Yanıtı İşleme: Service Worker'dan gelen yanıtı işler, transkriptleri transcriptOutput alanına yazdırır ve işlem durumunu statusDiv'de günceller.
  • Kopyalama İşlevi: navigator.clipboard.writeText() API'si ile çekilen tüm transkriptleri panoya kopyalama özelliği eklenmiştir.
  • Hata ve Durum Bildirimleri: Kullanıcıya anlaşılır hata mesajları ve işlem durumu güncellemeleri sunulur.
  • Mobil Uyumlu Tasarım: CSS içinde basit bir @media sorgusu ile popup'ın küçük ekranlarda da düzgün görünmesi sağlanmıştır. Bu, eklentinin farklı cihazlarda ve ekran boyutlarında daha iyi bir kullanıcı deneyimi sunmasına yardımcı olur.

Böylece, YouTube transkriptlerini toplu olarak çekmek için tüm temel bileşenleri tamamlamış olduk. Şimdi, bu eklentiyle neler yapılabileceğine dair gerçek dünya senaryolarına ve ileri düzey ipuçlarına göz atalım.

Vaka Analizi ve Gerçek Dünya Senaryoları: Bu Eklentiyle Neler Başarılabilir?

Geliştirdiğimiz bu Chrome eklentisi, sadece basit bir metin çıkarma aracı olmanın ötesinde, çeşitli sektörlerde ve kullanım alanlarında güçlü bir potansiyele sahiptir. Toplu YouTube transkriptleri elde etme yeteneği, özellikle veri odaklı çalışan profesyoneller için pek çok kapıyı aralar. İşte bu eklentinin gerçek dünya senaryolarında nasıl kullanılabileceğine dair bazı vaka analizleri ve uygulama örnekleri:

1. İçerik Pazarlaması ve SEO Optimizasyonu: Bir içerik pazarlamacısı, belirli bir nişdeki en popüler 50 YouTube videosunun transkriptlerini çekebilir. Bu transkriptleri bir araya getirerek, metin analizi araçlarıyla sıkça kullanılan anahtar kelimeleri, trend olan konuları ve izleyiciyi en çok meşgul eden ifade biçimlerini tespit edebilir. Örneğin, "dijital pazarlama ipuçları" aramasında çıkan videolardan çekilen transkriptler, hangi spesifik terimlerin (örn. "SEO stratejileri", "sosyal medya algoritmaları", "içerik takvimi") en çok geçtiğini gösterebilir. Bu bilgiler, yeni video içerikleri, blog yazıları veya e-kitaplar oluştururken stratejik bir rehber görevi görür. Ayrıca, kendi videolarının transkriptlerini çıkararak, onları blog yazılarına dönüştürebilir veya video açıklamalarında kullanarak SEO sıralamalarını iyileştirebilirler. Bu sayede, videolarının yalnızca izlenirlik değil, aynı zamanda organik arama sonuçlarındaki görünürlüğünü de artırabilirler.

2. Akademik Araştırma ve Sosyal Bilimler: Bir sosyolog, belirli bir sosyal hareketle ilgili yüzlerce YouTube videosunun (tartışmalar, röportajlar, belgeseller) transkriptlerini toplayabilir. Bu büyük metin veri setini kullanarak duygu analizi, konu modellemesi veya kelime frekans analizleri yapabilir. Örneğin, "iklim değişikliği" konulu videolardaki söylemlerin zaman içindeki değişimini, hangi terimlerin daha pozitif veya negatif çağrışımlar taşıdığını inceleyebilir. Bu, kamuoyu algısının nasıl şekillendiğini, farklı grupların konuya yaklaşımlarını veya belirli olayların tartışma dinamiklerini anlamak için eşsiz bir veri kaynağı sağlar. Geleneksel anket veya mülakat yöntemlerinin sınırlı kaldığı durumlarda, YouTube transkriptleri daha geniş ve doğal bir veri havuzu sunar.

3. Erişilebilirlik ve İçerik Yeniden Kullanımı: İşitme engelli bireyler için video içeriklerinin erişilebilirliğini artırmak isteyen bir sivil toplum kuruluşu veya eğitim kurumu, bir dizi eğitim videosunun transkriptlerini otomatik olarak çekerek bunları metin formatında sunabilir. Böylece, video izleyemeyen veya izlemek istemeyen kişilerin de içeriğe tam olarak erişmesini sağlayabilirler. Ayrıca, eğitimciler, ders materyallerini zenginleştirmek için belirli konular hakkındaki YouTube videolarının transkriptlerini alıp, bunları özetleyebilir, anahtar noktaları vurgulayabilir veya farklı dillerde çevirerek global bir öğrenci kitlesine hitap edebilirler. Bu sadece erişilebilirliği artırmakla kalmaz, aynı zamanda içeriğin farklı öğrenme stillerine uygun hale getirilmesine de yardımcı olur.

4. Rekabet Analizi ve Trend Takibi: Bir ürün geliştirme ekibi, rakiplerinin ürün tanıtım videoları veya müşteri yorumlarını içeren videolarının transkriptlerini çıkararak, ürünlerinin güçlü ve zayıf yönlerini, kullanıcıların beklentilerini ve pazarın genel eğilimlerini analiz edebilir. Örneğin, "akıllı telefon incelemeleri" videolarının transkriptlerini inceleyerek, hangi özelliklerin (kamera kalitesi, pil ömrü, yazılım deneyimi) en çok tartışıldığını ve kullanıcılar tarafından nasıl değerlendirildiğini hızlıca öğrenebilirler. Bu bilgiler, yeni ürün geliştirme süreçlerinde veya mevcut ürünlerin iyileştirilmesinde değerli içgörüler sunar. Ayrıca, trend olan anahtar kelimeler ve konuşma konuları, gelecekteki ürün ve pazarlama stratejilerini belirlemede yol gösterici olabilir.

Bu senaryolar, geliştirilen eklentinin çok yönlülüğünü ve farklı alanlarda nasıl değer yaratabileceğini göstermektedir. Toplu transkript çıkarma yeteneği, veri analizi, içerik stratejisi ve erişilebilirlik gibi alanlarda manuel iş yükünü azaltarak verimliliği artırır ve daha derinleşimli analizlere olanak tanır.

İleri Düzey İpuçları ve Optimizasyonlar: Performansı ve Kullanılabilirliği Nasıl Artırırım?

Temel eklentimizi başarıyla oluşturduktan sonra, onu daha da sağlam, hızlı ve kullanıcı dostu hale getirmek için bazı ileri düzey teknikleri ve optimizasyonları düşünebiliriz. Bu iyileştirmeler, eklentinin performansını artırırken, aynı zamanda daha geniş bir kullanıcı kitlesine hitap etmesini sağlayacaktır. Özellikle toplu işlemler söz konusu olduğunda, verimlilik ve hata yönetimi kritik öneme sahiptir.

1. Hata Yönetimi ve Yeniden Deneme Mekanizmaları: YouTube'un dinamik yapısı veya ağ bağlantısı sorunları nedeniyle transkript çekme işlemleri bazen başarısız olabilir. Eklentimize daha robust bir hata yönetimi eklemek, bu tür durumları daha iyi ele almamızı sağlar. Örneğin, bir transkript çekme işlemi başarısız olduğunda, belirli bir gecikmeyle otomatik olarak yeniden deneme (retry) mekanizması uygulayabiliriz. Üç denemeden sonra hala başarısız oluyorsa, kullanıcıya bilgilendirici bir hata mesajı gösterebiliriz. Bu, kullanıcı deneyimini önemli ölçüde iyileştirir ve eklentinin daha güvenilir çalışmasını sağlar. Her bir video için ayrı hata loglaması yapmak ve bu hataları kullanıcıya anlaşılır bir dilde sunmak da önemlidir.


    // service-worker.js içinde retry mantığı örneği
    async function extractWithRetry(videoId, maxRetries = 3) {
        for (let i = 0; i < maxRetries; i++) {
            try {
                // ... mevcut sekme açma, script enjekte etme ve transkript çekme kodunuz ...
                const [transcriptResponse] = await chrome.scripting.executeScript({
                    target: { tabId: tab.id },
                    function: () => window.extractTranscript()
                });
                if (transcriptResponse && transcriptResponse.result && !transcriptResponse.result.startsWith("Hata:")) {
                    return { videoId, transcript: transcriptResponse.result };
                }
            } catch (error) {
                console.warn(Video ${videoId} için deneme ${i + 1} başarısız oldu:, error);
                if (i < maxRetries - 1) {
                    await new Promise(resolve => setTimeout(resolve, 2000 * (i + 1))); // Artan gecikme ile bekle
                }
            } finally {
                if (tab && tab.id) {
                    try {
                        await chrome.tabs.remove(tab.id);
                    } catch (e) { /* Sekme kapanırken oluşan hataları yoksay */ }
                }
            }
        }
        return { videoId, transcript: "Transkript çekilemedi (tüm denemeler başarısız)." };
    }

    // extractTranscripts aksiyonunda extractWithRetry çağrılabilir.
    

2. Hız Optimizasyonu ve Paralel İşleme: Şu anki eklentimiz, videoları tek tek işler. Ancak, aynı anda birden fazla sekme açarak bu işlemi hızlandırabiliriz. Bunun için Promise.all gibi yapıları kullanarak belirli sayıda videoyu paralel olarak işlemeye çalışabiliriz. Ancak, çok fazla sekme açmak tarayıcıyı yavaşlatabilir veya YouTube tarafından bot algılanmanıza neden olabilir. Bu nedenle, eşzamanlı işlem sayısını (örneğin 2-3 sekme) sınırlamak iyi bir stratejidir. Bu, hem performansı artırır hem de sistem kaynaklarının aşırı tüketilmesini önler.


    // Service Worker'da paralel işlem mantığı
    async function processVideosInBatches(videoIds, batchSize = 3) {
        const results = [];
        for (let i = 0; i < videoIds.length; i += batchSize) {
            const batch = videoIds.slice(i, i + batchSize);
            const batchPromises = batch.map(id => extractWithRetry(id)); // Her ID için bir promise
            const batchResults = await Promise.all(batchPromises); // Paralel olarak bekle
            results.push(...batchResults);
            // İhtiyaç duyulursa partiler arası kısa bir bekleme ekle
            await new Promise(resolve => setTimeout(resolve, 1000));
        }
        return results;
    }

    // extractTranscripts aksiyonunda bu fonksiyonu çağır.
    

3. Farklı Altyazı Formatları ve Çeviri Desteği: YouTube, videolar için birden fazla dilde altyazı veya otomatik çeviri sunabilir. Eklentimizi, kullanıcının belirli bir dil için transkriptleri çekmesini sağlayacak şekilde geliştirebiliriz. Bu, popup arayüzüne bir dil seçeneği ekleyerek ve Content Script'in bu dile uygun altyazı elementlerini hedeflemesini sağlayarak yapılabilir. Ayrıca, transkriptleri sadece düz metin olarak değil, SRT veya VTT gibi formatlarda da dışa aktarma seçeneği sunmak, eklentinin kullanım alanlarını genişletecektir.

Uzman İpucu: YouTube'un altyazı API'sine doğrudan erişim genellikle kısıtlıdır. Ancak, Content Script içinden sayfanın JavaScript objelerine veya belirli XML/JSON isteklerine bakarak dil seçeneklerini ve ilgili URL'leri bulmak mümkün olabilir. Bu, daha kararlı ve doğru bir transkript çekme yöntemi sunabilir. Ancak bu tür yaklaşımlar, YouTube'un sayfa yapısındaki değişikliklere karşı daha hassastır.

4. Kullanıcı Deneyimi ve İlerleme Göstergesi: Özellikle toplu işlemler uzun sürebileceğinden, kullanıcıya işlemin durumu hakkında sürekli geri bildirim sağlamak önemlidir. Popup'taki bir ilerleme çubuğu (progress bar) veya kaç videonun tamamlandığını gösteren bir sayaç, kullanıcı sabrını artırır. Ayrıca, çekilen transkriptleri video ID'lerine göre düzenli bir formatta sunmak ve kolayca indirilebilir hale getirmek (örneğin bir TXT dosyası olarak), kullanıcı deneyimini iyileştirecektir. Popup'ın boyutlarının ve elementlerinin mobil cihazlarda da düzgün görünmesi için responsive tasarım prensiplerini ve CSS Media Query'lerini kullanmak, eklentinin erişilebilirliğini artırır.


    /* popup.css veya inline style içinde medya sorgusu */
    @media (max-width: 400px) {
        body {
            width: auto; /* Küçük ekranlarda otomatik genişlik */
            padding: 10px;
        }
        textarea, button {
            width: 100%; /* Tam genişlik */
        }
    }
    

5. Kalıcı Depolama ve Veri Yönetimi: Kullanıcının daha önce çektiği transkriptleri veya ayarlarını saklamak için chrome.storage API'sini kullanabiliriz. Bu sayede, eklenti kapansa bile veriler kaybolmaz ve kullanıcılar daha önce çalıştıkları yerden devam edebilirler. Ayrıca, kullanıcıların büyük boyutlu transkriptleri yönetmelerine yardımcı olacak arayüzler (örn. filtreleme, arama) eklemek de düşünülebilir.

Bu ileri düzey ipuçları ve optimizasyonlar, geliştirdiğiniz Chrome eklentisini daha profesyonel, dayanıklı ve kullanıcılar için daha değerli hale getirecektir. Her bir iyileştirme, eklentinin genel kalitesini ve kullanım kolaylığını artırmaya yöneliktir.

Sonuç ve Gelecek Vizyonu: YouTube Transkript Eklentisiyle Elde Edilenler Neler?

Bu kapsamlı rehber boyunca, YouTube videolarından transkriptleri toplu olarak çekmek için güçlü bir Chrome eklentisi geliştirmeyi adım adım öğrendik. Manifest V3'ün temel prensiplerinden başlayarak, Service Worker'ların arka plan görevlerini nasıl yöneteceğini, Content Script'lerin YouTube sayfasıyla nasıl etkileşim kuracağını ve popup arayüzünün kullanıcıyla nasıl iletişim kuracağını detaylı bir şekilde inceledik. Geliştirdiğimiz bu eklenti, içerik üreticilerinden akademisyenlere, pazarlamacılardan araştırmacılara kadar geniş bir kitleye hitap eden, zaman kazandıran ve veri odaklı kararlar almayı kolaylaştıran stratejik bir araçtır.

Eklentimiz, YouTube'un dinamik yapısıyla başa çıkmak için tasarlanmıştır ve video ID'lerini veya URL'lerini kullanarak transkriptleri güvenilir bir şekilde elde eder. Gerçek dünya senaryolarında, bu eklentinin SEO optimizasyonundan içerik stratejilerine, akademik araştırmalardan erişilebilirlik çözümlerine kadar pek çok alanda kullanılabileceğini gördük. Artık manuel ve zahmetli transkript çıkarma süreçleri yerine, otomasyonun getirdiği verimlilikle daha derinleşimli analizlere ve daha yaratıcı içerik geliştirmeye odaklanabiliriz. Elde edilen transkriptler, anahtar kelime analizi, duygu analizi, konu modellemesi gibi çeşitli metin madenciliği teknikleri için değerli bir ham veri kaynağı sunar.

Gelecekte, bu eklenti daha da geliştirilebilir. Örneğin, YouTube API kotasını aşmadan daha büyük veri setlerini işlemek için akıllı bir önbellekleme mekanizması entegre edilebilir. Kullanıcının belirli anahtar kelimelere göre transkriptlerde arama yapmasını veya belirli bölümleri vurgulamasını sağlayan gelişmiş bir UI sunulabilir. Ayrıca, çekilen transkriptleri doğrudan Google Drive veya Dropbox gibi bulut depolama hizmetlerine aktarma seçenekleri eklenerek iş akışı daha da optimize edilebilir. Farklı dillerdeki altyazıları çekme ve bunları çevirme yeteneği, eklentinin uluslararası kullanımdaki değerini artıracaktır. Açık kaynak geliştirme topluluğunun katkılarıyla, bu eklenti sürekli olarak güncellenebilir ve yeni özelliklerle zenginleştirilebilir, böylece YouTube ekosistemindeki değişikliklere hızlıca adapte olabilir. Bu proje, Chrome eklentisi geliştirmenin gücünü ve esnekliğini gösteren somut bir örnek teşkil etmektedir.

Sıkça Sorulan Sorular

  1. Bu eklenti tüm YouTube videolarının transkriptlerini çekebilir mi?

    Eklenti, YouTube tarafından otomatik olarak oluşturulan altyazıları veya video yükleyicisi tarafından sağlanan altyazıları olan videoların transkriptlerini çekebilir. Eğer bir videoda altyazı veya transkript seçeneği hiç yoksa, eklenti doğal olarak bu veriyi çekemez. Özellikle çok eski veya nadir dildeki videolarda altyazı bulunmayabilir.

  2. Eklenti YouTube API kotamı etkiler mi?

    Hayır, bu eklenti YouTube Data API'sini kullanmaz. Bunun yerine, doğrudan tarayıcınızda açılan YouTube sayfasının DOM yapısını kullanarak transkript verilerini çeker. Bu yaklaşım, API kotalarından bağımsız çalışmanızı sağlar ve daha az kısıtlamayla toplu işlem yapmanıza olanak tanır.

  3. Toplu transkript çekerken tarayıcım yavaşlar mı veya kilitlenir mi?

    Eklenti, transkriptleri çekmek için her video için arka planda yeni bir sekme açıp kapatır. Çok sayıda video için işlem yaparken tarayıcınızda hafif bir yavaşlama hissedebilirsiniz. Service Worker'da uygulanan paralel işlem limiti (varsayılan olarak 3 video eş zamanlı) ve sekme kapatma mekanizması, bu yavaşlamayı minimize etmek için tasarlanmıştır. Ancak çok yüksek sayılardaki videolarda (örn. binlerce) işlem süresi uzayabilir ve tarayıcınızın kaynak tüketimi artabilir.

  4. YouTube'un arayüzü değişirse eklenti çalışmaya devam eder mi?

    YouTube, kullanıcı arayüzünü (UI) ve DOM yapısını zaman zaman günceller. Bu tür köklü değişiklikler, Content Script'in transkript düğmelerini veya panellerini bulma mantığını etkileyebilir. Eklenti, birden fazla CSS seçicisi kullanarak bu tür değişikliklere karşı bir miktar esneklik sağlamaya çalışsa da, büyük çaplı güncellemelerde eklentinin yeniden güncellenmesi gerekebilir. Bu, web scraping tabanlı eklentilerin doğasında olan bir durumdur.

  5. Çekilen transkriptleri nasıl dışa aktarabilirim?

    Mevcut durumda, çekilen tüm transkriptler popup arayüzündeki bir metin alanında görüntülenir ve "Tümünü Kopyala" düğmesi ile kolayca panoya kopyalanabilir. Kopyaladığınız metni daha sonra istediğiniz bir metin düzenleyiciye veya dosyaya (örn. TXT, DOCX) yapıştırarak kaydedebilirsiniz. Gelecekteki geliştirmelerde, doğrudan dosya indirme (TXT, CSV gibi) seçenekleri eklenebilir.

Yorumlar
İçeriği beğendiniz mi? Bir tartışma başlatın veya görüşlerinizi paylaşın.
Yorum Yaz

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

E-posta Bülteni
Yazılım Topluluğuna Katılın
En son güncellemeleri, yaratıcı ipuçlarını ve özel kaynakları doğrudan e-posta kutunuza alın. Tasarım ve inovasyonun geleceğini birlikte keşfedelim.