Wie man YouTube wie ein Profi scrappt: Ein umfassender Leitfaden

Raluca Penciuc am 20. Februar 2023

Benötigen Sie Daten von einer Website, aber die verfügbaren APIs reichen einfach nicht aus? Web Scraping ist die Antwort, nach der Sie gesucht haben. Mit Web Scraping können Sie Daten aus einer Website umfassender und flexibler extrahieren.

In diesem Artikel tauchen wir in die Welt des Web Scraping ein, indem wir uns genauer ansehen, wie man YouTube, eine der beliebtesten Video-Sharing-Plattformen, scrapen kann. YouTube stellt zwar eine API für den Datenzugriff zur Verfügung, aber Web Scraping bietet eine größere Auswahl an Optionen für die Extraktion von Daten aus YouTube-Kanälen.

Wir beginnen mit der Einrichtung einer Entwicklungsumgebung und den Voraussetzungen für Web Scraping und gehen dann zum eigentlichen Prozess des Scrapens von YouTube über. Auf dem Weg dorthin geben wir Ihnen Tipps, wie Sie Ihre Web-Scraping-Fähigkeiten verbessern können, und erörtern, warum es besser ist, einen professionellen Scraper zu verwenden, als selbst einen zu entwickeln.

Am Ende dieses Artikels wirst du mit dem Wissen und den Fähigkeiten ausgestattet sein, um effektiv Daten von YouTube zu scrapen wie ein Profi!

Voraussetzungen

Als Erstes müssen Sie sicherstellen, dass Sie Node.js auf Ihrem Rechner installiert haben. Wenn Sie es noch nicht haben, besuchen Sie die offizielle Node.js-Website und folgen Sie den Anweisungen für Ihr spezifisches Betriebssystem. Es ist wichtig zu beachten, dass Sie die Long Term Support (LTS) Version herunterladen sollten, um sicherzustellen, dass Sie eine stabile und unterstützte Version haben.

Als nächstes müssen Sie den Node.js Package Manager (NPM) installieren. Dies sollte automatisch mit Ihrer Node.js-Installation erfolgen, aber es ist immer gut, dies zu überprüfen.

Was Ihre Programmierumgebung angeht, so können Sie jede IDE verwenden, die Sie bevorzugen. Ich verwende in diesem Tutorial Visual Studio Code, weil es flexibel und einfach zu bedienen ist, aber jede IDE ist geeignet. Erstellen Sie einfach einen neuen Ordner für Ihr Projekt und öffnen Sie ein Terminal. Führen Sie den folgenden Befehl aus, um ein neues Node.js-Projekt einzurichten:

npm init -y

Dadurch wird eine standardmäßige package.json-Datei für Ihr Projekt erstellt. Sie können diese Datei jederzeit an Ihre Bedürfnisse anpassen.

Jetzt ist es an der Zeit, TypeScript und die Typdefinitionen für Node.js zu installieren. TypeScript ist in der JavaScript-Gemeinschaft wegen seiner optionalen statischen Typisierung beliebt, die Typfehler in Ihrem Code verhindern hilft. Um es zu installieren, führen Sie den folgenden Befehl aus:

npm install typescript @types/node --save-dev

Um zu überprüfen, ob die Installation erfolgreich war, können Sie den folgenden Befehl ausführen:

npx tsc --version

Schließlich müssen Sie eine Konfigurationsdatei tsconfig.json im Stammverzeichnis Ihres Projekts erstellen. Diese Datei definiert die Compiler-Optionen für Ihr Projekt. Wenn Sie mehr über diese Datei und ihre Eigenschaften erfahren möchten, lesen Sie die offizielle TypeScript-Dokumentation.

Alternativ können Sie auch den folgenden Code kopieren und in Ihre tsconfig.json-Datei einfügen:

{

   "compilerOptions": {

       "module": "commonjs",

       "esModuleInterop": true,

       "target": "es2017",

       "moduleResolution": "node",

       "sourceMap": true,

       "outDir": "dist"

   },

   "lib": ["es2015"]

}

Für den Scraping-Prozess verwende ich Puppeteer, eine Headless-Browser-Bibliothek für Node.js, mit der Sie einen Webbrowser steuern und programmatisch mit Websites interagieren können. Um Puppeteer zu installieren, führen Sie den folgenden Befehl aus:

npm Puppeteer installieren

Extrahieren der Daten

Für diesen Leitfaden werde ich einen YouTube-Kanal mit DevOps-bezogenen Tutorials durchforsten: https://www.youtube.com/@TechWorldwithNana/videos. Die Daten, die ich mir im Besonderen ansehe, sind:

• der Avatar des Senders
• der Name des Kanals
• der Griff des Kanals
• die Anzahl der Abonnenten des Kanals
• die Titel aller Videos
• die Anzahl der Aufrufe aller Videos
• das Vorschaubild für alle Videos
• die URL aller Videos

Ich werde für jeden Abschnitt Screenshots einfügen und mich auf CSS-Selektoren verlassen, um die Daten im DOM zu finden. Dies ist die einfachste und geradlinigste Methode, es sei denn, die Zielwebsite ist für ihre instabile DOM-Struktur bekannt.

Wenn Sie sich noch nicht mit CSS-Selektoren auskennen, sollten Sie sich diesen umfassenden Spickzettel ansehen, mit dem Sie im Handumdrehen loslegen können.

Beginnen wir mit der Erstellung eines Ordners src und der Datei index.ts, in die wir den Code schreiben werden. Nun öffnen wir einfach einen Browser und navigieren zur Ziel-URL:

import puppeteer from 'puppeteer';

async function scrapeChannelData(channelUrl: string): Promise<any> {

    // Launch Puppeteer

    const browser = await puppeteer.launch({

        headless: false,

    	  args: ['--start-maximized'],

    	  defaultViewport: null

    });

    // Create a new page and navigate to the channel URL

    const page = await browser.newPage();

    await page.goto(channelUrl);

    // Close the browser

    await browser.close();

}

scrapeChannelData("https://www.youtube.com/@TechWorldwithNana/videos");

Für visuelle Debugging-Zwecke öffne ich den Browser im Nicht-Headless-Modus. Wenn Sie beabsichtigen, Ihren Anwendungsfall in großem Maßstab zu erweitern, empfehle ich Ihnen, den Headless-Modus auszuprobieren.

Um das Skript auszuführen, müssen Sie es zuerst kompilieren und dann die generierte Javascript-Datei ausführen. Um die Sache zu vereinfachen, können wir ein Skript in der package.json-Datei definieren, das beide Schritte für uns erledigt. Bearbeiten Sie einfach den Abschnitt scripts in Ihrer package.json-Datei wie folgt:

"scripts": {

    "test": "npx tsc && node dist/index.js"

},

Jetzt müssen Sie nur noch den folgenden Befehl ausführen, um Ihren Code zu starten:

npm test ausführen

Seit dem ersten Durchlauf ist uns ein erstes Problem aufgefallen: der bildschirmfüllende Cookie-Einwilligungsdialog, der uns am Zugriff auf die Daten hindert.

Glücklicherweise ist sie im Ansichtsfenster sichtbar, so dass wir mit den Entwicklertools ihren Bezeichner finden und anklicken können.

Wir fügen auch eine zusätzliche Wartezeit ein, damit die Navigation abgeschlossen werden kann. Der Code wird wie folgt aussehen:

await page.waitForSelector('button[aria-label="Accept all"]')

await page.click('button[aria-label="Accept all"]')

await page.waitForTimeout(10 * 1000)

Kanal-Infos

In der folgenden Abbildung sind die Abschnitte hervorgehoben, die die zu extrahierenden Kanaldaten enthalten.

Eine gute Faustregel für die einfache Lokalisierung der HTML-Elemente ist die Wahl eindeutiger CSS-Selektoren. Um zum Beispiel den Kanal Avatar zu extrahieren, wähle ich das benutzerdefinierte HTML-Element yt-img-shadow mit der id avatar. Dann extrahiere ich das src-Attribut des untergeordneten Elements img .

const channelAvatar = await page.evaluate(() => {

    const el = document.querySelector('yt-img-shadow#avatar > img');

    return el ? el.getAttribute('src') : null;

});

console.log(channelAvatar)

Für den Kanalnamen haben wir den Textinhalt des Elements yt-formatted-string mit der id text.

const channelName = await page.evaluate(() => {

    const el = document.querySelector('yt-formatted-string#text');

    return el ? el.textContent : null;

});

console.log(channelName)

Um den Channel-Handle zu erhalten, suchen wir das Element yt-formatted-string mit der id channel-handle und extrahieren seinen Textinhalt.

const channelHandle = await page.evaluate(() => {

    const el = document.querySelector('yt-formatted-string#channel-handle');

    return el ? el.textContent : null;

});

console.log(channelHandle)

Und für die Anzahl der Kanalabonnenten müssen wir nur auf das Element yt-formatted-string mit der id subscriber-count zugreifen und seinen Textinhalt abrufen.

const subscriberCount = await page.evaluate(() => {

    const el = document.querySelector('yt-formatted-string#subscriber-count');

    return el ? el.textContent : null;

});

console.log(subscriberCount)

Wenn Sie das Skript erneut ausführen, sollten Sie die folgende Ausgabe sehen:

https://yt3.googleusercontent.com/kXyR8Aa32KXnZWVdkAFUYK5utM752kSJPHGtYiJ4ev6BmdFHi-dl1EFbI3TogmHBjszwc7m2=s176-c-k-c0x00ffffff-no-rj

TechWorld with Nana

@TechWorldwithNana

709K subscribers

Video-Daten

In den Videodaten habe ich auch die relevanten Abschnitte des HTML-Dokuments hervorgehoben. Hier sollten wir eine Liste von Elementen extrahieren, also schauen wir uns zuerst die übergeordneten Container an und gehen dann jedes einzelne davon durch.

Wir folgen dem gleichen Ansatz wie im vorigen Abschnitt: Wir wählen einige eindeutige CSS-Selektoren, um die benötigten Daten zu finden, wobei wir uns auf ihre IDs konzentrieren. Der Code sollte in etwa wie folgt aussehen:

const videos = await page.evaluate(() => {

    const videosEls = Array.from(document.querySelectorAll('div#dismissible'))

    return videosEls.map(video => {

        const titleEl = video.querySelector('yt-formatted-string#video-title');

        const viewsEl = video.querySelector('div#metadata-line > span');

        const thumbnailEl = video.querySelector('yt-image.ytd-thumbnail > img');

        const locationEl = video.querySelector('a#thumbnail');

        return {

            title: titleEl ? titleEl.textContent : null,

            views: viewsEl ? viewsEl.textContent : null,

            thumbnail: thumbnailEl ? thumbnailEl.getAttribute('src') : null,

            location: locationEl ? locationEl.getAttribute('href') : null

        }

    })

})

console.log(videos)

Wenn Sie den Code ausführen, sollte die Ausgabe eine Liste von Javascript-Objekten sein. Jedes dieser Objekte sollte den Titel, die Anzahl der Aufrufe, das Vorschaubild und die Position jedes Videoelements auf der Seite enthalten.

Sie werden jedoch feststellen, dass Ihre Liste ab einem bestimmten Punkt wie folgt aussieht:

{

    title: 'GitLab CI/CD Full Course released - CI/CD with Docker | K8s | Microservices!',  

    views: '114K views',

    thumbnail: null,

    location: '/watch?v=F7WMRXLUQRM'

},

{

    title: 'Kubernetes Security Best Practices you need to know | THE Guide for securing your K8s cluster!',

    views: '103K views',

    thumbnail: null,

    location: '/watch?v=oBf5lrmquYI'

},

{

    title: 'How I learn new technologies as a DevOps Engineer (without being overwhelmed)',

    views: '366K views',

    thumbnail: null,

    location: '/watch?v=Cthla7KqU04'

},

{

    title: 'Automate your Multi-Stage Continuous Delivery and Operations | with Keptn',	 

    views: '59K views',

    thumbnail: null,

    location: '/watch?v=3EEZmSwMXp8'

},

Obwohl die Videoelemente immer noch eine Miniaturansicht haben und der CSS-Selektor sich nicht geändert hat, ist der extrahierte Wert null. Dies geschieht in der Regel, wenn eine Website Lazy Loading implementiert, was bedeutet, dass der Rest der Liste geladen wird, wenn Sie zum unteren Ende der Seite scrollen.

Um dieses Problem zu lösen, müssen wir unser Skript einfach anweisen, auf der Kanalseite nach unten zu blättern.

async function autoScroll(page: any, scroll_number: number): Promise<any> {

    await page.evaluate(async (scroll_number: number) => {

        await new Promise((resolve) => {

            let totalHeight = 0;

        	const timer = setInterval(() => {

                const scrollHeight = window.innerHeight * scroll_number;

                window.scrollBy(0, window.innerHeight);

                totalHeight += window.innerHeight;

                if (totalHeight > scrollHeight) {

                    clearInterval(timer);

                	  resolve(true);

                }

        	}, 1000);

    	  });

    }, scroll_number);

}

Diese Funktion nimmt als Parameter unsere geöffnete Seite und eine Anzahl von Bildlaufbewegungen an. Dann versucht sie, so oft, wie es der Parameter scroll_number angibt, um die der Fensterhöhe entsprechende Strecke zu scrollen. Diese Bewegungen werden alle 1 Sekunde durchgeführt.

Rufen Sie nun einfach die Funktion vor dem Codeschnipsel auf, die die Liste der Videos extrahiert.

await autoScroll(Seite, 10)

await page.waitForTimeout(2 * 1000)

Ich habe eine zusätzliche Wartezeit von 2 Sekunden hinzugefügt, damit die Website Zeit hat, die letzten Elemente der Liste vollständig zu laden. Wenn Sie das Skript erneut ausführen, können Sie zunächst sehen, wie die Bildlaufbewegungen erfolgen, und dann, dass alle Elemente in der Liste einen Miniaturbildwert haben.

Vermeiden Sie eine Blockade

Auch wenn die Anleitung bis zu diesem Punkt mühelos erschien, gibt es mehrere Herausforderungen, denen Web-Scraper normalerweise begegnen. Insbesondere YouTube setzt viele Anti-Bot-Techniken ein, um zu verhindern, dass automatisierte Skripte seine Daten extrahieren.

Einige dieser Techniken sind:

• CAPTCHAs: Das Lösen von CAPTCHAs kann für einen Scraper zeitaufwändig und schwierig sein, was für Bots abschreckend wirken kann.
• JavaScript-Herausforderungen: Sie können Aufgaben wie das Lösen von Matheaufgaben, das Ausfüllen eines CAPTCHA oder das Auffinden eines bestimmten Elements auf der Seite umfassen. Ein Bot, der nicht in der Lage ist, die Aufgabe zu lösen, wird erkannt und möglicherweise blockiert.
• User-Agent-Prüfungen: YouTube kann den User-Agent-String eingehender Anfragen überprüfen, um festzustellen, ob sie von einem Browser oder einem Scraper stammen. Wenn der User-Agent-String nicht als gültiger Browser erkannt wird, kann die Anfrage blockiert werden.
• IP-Blockierung: YouTube kann Anfragen von bestimmten IP-Adressen blockieren, von denen bekannt ist, dass sie mit Bots oder Scraping-Aktivitäten in Verbindung stehen.
• Honeypots: YouTube kann Honeypots verwenden, das sind versteckte Elemente auf der Seite, die nur für Bots sichtbar sind. Wenn ein Bot bei der Interaktion mit einem Honeypot entdeckt wird, kann er identifiziert und blockiert werden.

Die Behandlung jedes einzelnen dieser Probleme kann die Komplexität und die Kosten Ihres Scraper-Codes erheblich erhöhen. Hier spielen die Scraping-APIs eine wichtige Rolle, da sie diese Probleme standardmäßig behandeln und zu einem niedrigeren Preis erhältlich sind.

WebScrapingAPI ist ein Beispiel für einen solchen Dienst. Er bietet leistungsstarke Funktionen zur Vermeidung von Bot-Erkennungstechniken und zur genauen Extraktion der von Ihnen benötigten Daten.

Wir können die Verwendung von WebScrapingAPI schnell ausprobieren, indem wir das Node.js SDK in unserem kleinen Projekt installieren:

npm i webscrapingapi

Besuchen Sie nun die Homepage, um ein Konto zu registrieren, wodurch Sie automatisch Ihren API-Schlüssel und eine kostenlose Testversion erhalten. Den API-Schlüssel finden Sie auf dem Dashboard, und Sie werden ihn verwenden, um Ihre Anfragen an die API zu authentifizieren:

Und schon können Sie mit dem Programmieren beginnen!

import webScrapingApiClient from 'webscrapingapi';

const client = new webScrapingApiClient("YOUR_API_KEY");

async function exampleUsage(target_url: string) {

    const api_params = {

        'render_js': 1,

    	  'proxy_type': 'datacenter',

    	  'country': 'us',

    	  'timeout': 60000,

    	  'js_instructions': JSON.stringify([

            {

                action: "click",

                selector: 'button[aria-label="Accept all"]',

                timeout: 10000

         	}

    	  ]),

    	  'extract_rules': JSON.stringify({

        	avatar: {

                selector: "yt-img-shadow#avatar > img",

                output: "@src",

        	},

        	name: {

                selector: "yt-formatted-string#text",

                output: "text",

        	},

        	handle: {

                selector: "yt-formatted-string#channel-handle",

                output: "text",

        	},

        	subscribers: {

                selector: "yt-formatted-string#subscriber-count",

                output: "text",

        	},

        	videoTitles: {

                selector: "yt-formatted-string#video-title",

                output: "text",

                all: "1"

        	},

        	videoViews: {

                selector: "div#metadata-line > span",

                output: "text",

                all: "1"

        	},

        	videoThumbnails: {

                selector: "yt-image.ytd-thumbnail > img",

                output: "@src",

                all: "1"

        	},

        	videoLocations: {

                selector: "a#thumbnail",

                output: "@href",

                all: "1"

        	},

        })

    }

    const response = await client.get(target_url, api_params);

    if (response.success) {

        console.log(response.response.data);

    } else {

        console.log(response.error.response.data);

    }

}

exampleUsage("https://www.youtube.com/@TechWorldwithNana/videos");

Wir haben den Algorithmus und die CSS-Selektoren, die zuvor beschrieben wurden, auf die API übertragen. Der Parameter "js_instructions" behandelt das Cookie-Fenster, indem er die Schaltfläche "Accept All" anklickt. Der Parameter "extract_rules" schließlich ist für die Datenextraktion zuständig.

const scroll_number = 10

let scroll_index = 0

for (let i = 0; i < scroll_number; i++) {

    const js_instructions_obj = JSON.parse(api_params.js_instructions)

    js_instructions_obj.push({

        action: "scrollTo",

        selector: `ytd-rich-grid-row.ytd-rich-grid-renderer:nth-child(${scroll_index + 3})`,

        block: "end",

     	  timeout: 1000

    })

    api_params.js_instructions = JSON.stringify(js_instructions_obj)

    scroll_index += 3

}

Vergessen Sie dann nicht, kurz vor dem Senden der Anforderung auch die Bildlauflogik anzupassen. Dies wird etwas anders sein, da wir die API anweisen, 10 Mal zur dritten Reihe von Videos zu blättern.

Schlussfolgerung

In diesem Artikel haben wir das spannende Feld des Web Scraping erkundet und gelernt, wie man mit Node.js und Puppeteer Daten von YouTube scrapen kann. Wir haben die notwendigen Einstellungen für Web Scraping sowie den Prozess der Extraktion von Daten aus YouTube-Kanälen behandelt.

Web Scraping kann ein unglaublich nützliches Werkzeug für den Zugriff auf Daten von Websites sein. Dennoch ist es wichtig, die verschiedenen Herausforderungen und Überlegungen, die damit einhergehen, zu berücksichtigen. Dazu können CAPTCHAs, dynamische Inhalte, Ratenbegrenzungen oder Website-Änderungen gehören.

Wenn Sie mit dem Gedanken spielen, Daten von YouTube oder einer anderen Website zu scrapen, sollten Sie unbedingt die Vor- und Nachteile abwägen und entscheiden, ob Web Scraping die beste Lösung für Ihre Bedürfnisse ist. In einigen Fällen kann die Verwendung einer API oder der Kauf von Daten von einer seriösen Quelle eine bessere Option sein als Scraping.

Unabhängig davon, für welchen Ansatz Sie sich entscheiden, ist es wichtig, dass Sie die Nutzungsbedingungen und Urheberrechtsgesetze beachten, die für die Daten gelten, auf die Sie zugreifen. Und wenn Sie sich entscheiden, Daten von YouTube zu scrapen, denken Sie daran, einen professionellen Scraper zu verwenden, um sicherzustellen, dass Sie genaue, aktuelle Daten auf sichere und effiziente Weise erhalten.

Ich hoffe, dieser Artikel war hilfreich für dich, um mehr über Web Scraping und das Scrapen von YouTube-Daten zu erfahren!