Um Du web scraping in JavaScript, du brauchst Node.js und einer Bibliothek, die auf deine Zielgruppe zugeschnitten ist. Nutze Cheerio für statische Seiten und Puppeteer Wo Playwright sobald der Inhalt auf der Client-Seite gerendert wird.
Dieser Leitfaden zeigt dir Schritt für Schritt, wie du deinen ersten Scraper installierst, programmierst und ausführst.
Voraussetzungen für das Web Scraping mit JavaScript
Bevor du dein erstes JS-Skript schreibst, reichen zwei grundlegende Tools aus, um loszulegen.
- Node.js : eine JavaScript-Laufzeitumgebung Open Source und plattformübergreifend. Damit kannst du JavaScript-Code außerhalb eines Browsers direkt über deine Konsole ausführen. Lade es von der offiziellen Node.js-Dokumentation herunter.
- npm (Node Package Manager): der in Node. Damit kannst du deine Bibliotheken mit einem einzigen Befehl installieren
npm install.
Einmal Node.js Sobald die Bibliothek installiert ist, wählst du je nach Art der zu scrapenden Webseite eine Bibliothek aus. Hier sind die am häufigsten verwendeten.
- Cheerio : perfekt für den Scraping statischer Seiten. Sie analysiert den rohen HTML-Code mit einer Syntax, die der folgenden ähnelt: jQuery. Sie ist leicht, schnell und einfach, führt aber das JavaScript der Seite nicht aus. Siehe die Cheerio-Dokumentation.
- Puppeteer und Playwright : ideal für die dynamische Websites. Sie steuern einen echten Headless-Browser (Chrome Wo Firefox) und laden die Seite wie ein echter Nutzer. Siehe die Puppeteer-Dokumentation.
Die Regel ist einfach: Cheerio für statische Seiten, Puppeteer Wo Playwright sobald eine Website ihre Daten per JavaScript lädt.
Wie kann man mit JavaScript Web Scraping betreiben?
Das Prinzip ist ganz einfach: Du holst dir das HTML Auf einer Webseite suchst du dir die Elemente heraus, die dich interessieren, und extrahierst dann die Daten. Die Wahl des Tools hängt von einem einzigen Kriterium ab: Ist die Seite statisch Wo dynamisch ?
Schritt 1: Installation und Konfiguration
Lade zunächst die Datei herunter Node.js von der offiziellen Website herunter und installiere es anschließend. Überprüfe anschließend die Installation in deinem Terminal:
node -v
npm -vWenn beide Versionen angezeigt werden, ist alles in Ordnung. Erstelle nun dein Projekt:
mkdir mein-scraping
cd mein-scraping
npm init -yDieser Befehl erzeugt eine Datei package.json das deine Abhängigkeiten auflistet. Jetzt musst du nur noch die für deine Anforderungen geeigneten Bibliotheken installieren.
Für eine statische Seite (Inhalt, der bereits im vom Server zurückgegebenen HTML-Code enthalten ist), verwende axios und Cheerio :
npm install axios cheerioFür eine dynamische Seite (Daten, die clientseitig über JavaScript geladen werden, wie z. B. React, Vue Wo Angular), installiere stattdessen Puppeteer :
npm install puppeteerSchritt 2: Erstellen eines Scraping-Skripts
Bevor du dein JS-Skript programmierst, solltest du die richtigen Elemente identifizieren CSS-Selektoren. Öffnet die Zielwebseite in Chrome Wo Firefox, klicke mit der rechten Maustaste auf das gewünschte Element und wähle dann «Untersuchen». Das DOM wird angezeigt: So kannst du das Tag und die Klasse ausfindig machen (.Klasse) oder die Kennung (#id), die ins Visier genommen werden sollen.
Scraping einer statischen Seite mit Cheerio
Cheerio liest nur das Roh-HTML und führt kein JS-Skript aus. Auf einer seitenseitig gerenderten Website sieht er lediglich eine leere Seite.
// Importieren von Bibliotheken
const axios = require('axios');
const cheerio = require('cheerio');
// URL der zu scrapenden Seite
const url = "https://exemple.com";
// Hauptfunktion
async function scrapePage() {
try {
// Herunterladen des HTML-Inhalts
const { data } = await axios.get(url);
// HTML mit Cheerio hochladen
const $ = cheerio.load(data);
// Beispiel: Abrufen aller Titel h1
const Titel = [];
$("h1").each((i, elem) => {
titel.push($(elem).text().trim());
});
// Ergebnisse anzeigen
console.log("Titel gefunden:", Titel);
} catch (error) {
console.error("Fehler beim Scraping:", error);
}
}
// Starten Sie das Skript
scrapePage();
Ersetzt https://exemple.com mit einer URL deiner Wahl und passe dann den Selektor an $("h1") um genau das zu finden, was dich interessiert: $("p") für die Absätze, .Klasse Wo #id für ein bestimmtes Element. Die Methode .text() gibt das zurück textContent des Elements, das Äquivalent von jQuery auf Serverseite.
Scraping einer dynamischen Seite mit Puppeteer
Puppeteer ein echter Pilot headless browser und wartet, bis das JavaScript den Inhalt vollständig geladen hat, wo Cheerio scheitert.
// Puppeteer importieren
const puppeteer = require("puppeteer");
// URL der zu scrapenden Seite
const url = "https://exemple.com";
async function scrapePage() {
// Starten eines Browsers ohne grafische Benutzeroberfläche (headless).
const browser = await puppeteer.launch({ headless: true });
const page = await browser.newPage();
try {
// Auf die Seite gehen
await page.goto(url, { waitUntil: "networkidle2" });
// Beispiel: Extrahieren des Textes aus allen Überschriften h1
const Überschriften = await page.$$eval("h1", elements =>.
elements.map(el => el.textContent.trim())
);
console.log("Titel gefunden:", titel);
} catch (error) {
console.error("Fehler beim Scraping:", error);
} finally {
// Schließen des Browsers
await browser.close();
}
}
// Starten des Skripts
scrapePage();
Die Option waitUntil: "networkidle2" wartet auf das Ende der Netzwerkanfragen bevor die Daten von der Webseite extrahiert werden.
Schritt 3: Verwaltung der extrahierten Daten
Sobald die Daten abgerufen wurden, kannst du sie speichern unter JSON für eine Datenbank oder in CSV um sie in Excel zu öffnen. Das Modul fs stammt aus Node.js und erfordert keine Installation. Für CSV füge einfach die Bibliothek hinzu json2csv :
npm install json2csvconst axios = require("axios");
const cheerio = require("cheerio");
const fs = require("fs");
const { Parser } = require("json2csv");
const url = "https://exemple.com";
async function scrapeAndSave() {
try {
// Récupérer le HTML de la page
const { data } = await axios.get(url);
const $ = cheerio.load(data);
// Extraire les titres dans un tableau d'objets
const resultats = [];
$("h1").each((i, elem) => {
resultats.push({ titre: $(elem).text().trim() });
});
// Sauvegarde en JSON
fs.writeFileSync("resultats.json", JSON.stringify(resultats, null, 2), "utf-8");
console.log("Données sauvegardées dans resultats.json");
// Sauvegarde en CSV
const parser = new Parser();
const csv = parser.parse(resultats);
fs.writeFileSync("resultats.csv", csv, "utf-8");
console.log("Données sauvegardées dans resultats.csv");
} catch (error) {
console.error("Erreur lors du scraping :", error);
}
}
scrapeAndSave();
Dieses JS-Skript erledigt alles auf einen Schlag: Es ruft die Webseite ab, extrahiert die HTML-Daten und schreibt dann zwei Dateien. Der Block try / catch behandelt Fehler, um zu verhindern, dass ein Auszeit oder eins CAPTCHA dazu führt, dass das gesamte Scraping-Skript abstürzt.
Best Practices für Web Scraping in JavaScript
Bevor du deine Skripte startest, solltest du ein paar einfache Vorsichtsmaßnahmen beachten, um dein JS-Scraping zu schützen effizient, stabil und die Nutzungsbedingungen der betreffenden Websites einhält. Es ist außerdem wichtig, dass du sicherstellst, dass deine Dieses Vorgehen ist rechtmäßig je nach Kontext.
- Beachten Sie die Datei robots.txt : Das ist die goldene Regel. Bevor du eine Webseite scrapst, öffne
https://exemple.com/robots.txt. Wenn der angegebene Pfad in Disallow, kopiere es nicht. So vermeidest du ethische und rechtliche Probleme. - Deine Anfragen zeitlich staffeln : Überlastet die Website nicht. Lasst zwischen jedem Aufruf etwas Zeit, um unauffällig zu bleiben und zu vermeiden, dass ihr blockiert werdet.
- Deinen User-Agent anpassen : Standardmäßig wird ein JS-Scraper schnell entdeckt. Mit Puppeteer, definiere einen realistischen Header über
page.setUserAgent()um einen echten Browser nachzuahmen. - Mit Fehlern und Blockaden umgehen : Fasse deine Aufrufe in einem Block zusammen
try / catchum zu verhindern, dass ein Timeout oder ein CAPTCHA das gesamte Skript zum Absturz bringt.
Welche Alternativen sind zu berücksichtigen?
Web-Scraping beschränkt sich nicht nur auf JavaScript. Je nach deinem Projekt können andere Sprachen oder Tools deinen Anforderungen besser gerecht werden.
- Python : die Bibliotheken Scrapy und BeautifulSoup leisten hervorragende Arbeit beim Extrahieren von Inhalten aus zahlreichen Webseiten.
- PHP : Praktisch, wenn du das Scraping direkt in eine Website integrieren möchtest, die bereits in dieser Sprache programmiert ist.
- Tools ohne Programmierung wie Bright Data, Octoparse und Apify: Mit ihnen kannst du Webdaten scrapen, ohne auch nur eine einzige Zeile Code schreiben zu müssen.
Scraping-API oder DIY-Lösung: Was soll man wählen?
Die eigentliche Frage ist nicht die Sprache, sondern der Grad an Komplexität, den du selbst bewältigen kannst. Dein eigenes Scraping-Skript mit Puppeteer Wo Cheerio bleibt die beste Option, wenn das Volumen gering ist und der Standort nur unzureichend geschützt ist.
A Scraping-API (wie sie beispielsweise von Bright Data angeboten wird) gewinnt an Bedeutung, sobald du auf komplexere Blockierungen stößt: IP-Adressrotation, automatische CAPTCHA-Lösung, JavaScript-Rendering in großem Maßstab.
Zusammenfassend lässt sich sagen: Der DIY spart dir Geld und bringt dir viel bei. Das’API spart dir Zeit bei aufwendigen oder wiederkehrenden Projekten.
Häufig gestellte Fragen
Welches ist das beste Web-Scraping-Tool in JavaScript?
Das hängt ganz davon ab, welche Art von Webseite du scrapen möchtest.
- Cheerio : schnell und leicht, perfekt für den HTML-Code analysieren statische Seiten.
- Puppeteer : ideal, um einen echten Browser zu steuern Chrome und die mit JavaScript gerenderten Inhalte zu verwalten.
- Playwright : in der Nähe von Puppeteer, aber mit dem Unterstützung verschiedener Browser (Chrome, Firefox, WebKit) sowie weitere erweiterte Funktionen.
Welche Programmiersprache ist die beste für Scraping?
Es gibt keine beste universelle Sprache. Die Wahl hängt von deinem Projekt und deinem Umfeld ab.
- Python : sehr beliebt für schnelle Projekte und große Mengen an Webdaten.
- JavaScript : Die richtige Vorgehensweise, wenn du bereits im Web-Ökosystem mit Node.js.
- PHP : Praktisch, um das Scraping direkt in eine bestehende Website zu integrieren.
das web scraping in JavaScript ist nach wie vor eine ausgezeichnete Wahl für Webdaten sammeln, dass du über Cheerio, Puppeteer Wo Playwright.
Wenn du noch mehr erfahren möchtest, ohne Code zu schreiben, wirf doch mal einen Blick auf unsere Anleitungen zu Bright Data, Octoparse und Apify.
DE