DEV Community

hanna Fischer
hanna Fischer

Posted on

Effizientes Scrapen von JavaScript-Webseiten

Die Möglichkeiten, JavaScript beim Web Crawling zu nutzen

Statische Websites: Axios und Cheerio
Lassen Sie uns das Crawlen einer statischen E-Commerce-Website mit JavaScript durchgehen. Für dieses Beispiel nutzen wir zwei beliebte Bibliotheken: Axios für HTTP-Anfragen und Cheerio zum Parsen von HTML.

*1. Abhängigkeiten installieren *
Installieren Sie Axios und Cheerio mit npm:

npm install axios cheerio

*2. Skript erstellen *
Erstellen Sie eine JavaScript-Datei, z. B. scrapeEcommerce.js, und öffnen Sie sie in Ihrem Code-Editor.

*3. Module importieren *
Importieren Sie Axios und Cheerio in Ihrem Skript:

const axios = require('axios');

const cheerio = require('cheerio');

*4. Ziel-URL definieren *
Wählen Sie die E-Commerce-Website, die Sie abrufen möchten. In diesem Beispiel nutzen wir die hypothetische URL http://example-ecommerce.com. Ersetzen Sie diese durch die gewünschte URL:

const url = 'http://example-ecommerce.com';

*5. HTML-Inhalt abrufen *
Verwenden Sie Axios, um eine GET-Anfrage an die Ziel-URL zu senden und den HTML-Inhalt zu holen:

axios.get(url)

.then(response => {

const html = response.data;

// HTML-Inhalt kann jetzt geparst werden

})

.catch(error => {

console.error('Error fetching the page:', error);

});

*6. HTML parsen und Daten extrahieren *
Nutzen Sie Cheerio, um den HTML-Code zu analysieren und die gewünschten Informationen zu extrahieren, beispielsweise Produktnamen und Preise:

axios.get(url)

.then(response => {

const html = response.data;

const $ = cheerio.load(html);

const products = [];  

$('.product').each((index, element) => {  
  const name = $(element).find('.product-name').text().trim();  
  const price = $(element).find('.product-price').text().trim();  
  products.push({ name, price });  
});  

console.log(products);  
Enter fullscreen mode Exit fullscreen mode

})

.catch(error => {

console.error('Error fetching the page:', error);

});

*Wichtigste Punkte *

  • axios.get(url): Sendet eine GET-Anfrage und gibt ein Versprechen zurück.
  • .then(response => { … }): Bei erfolgreicher Anfrage ist der HTML-Inhalt in response.data.
  • cheerio.load(html): Lädt den HTML-Inhalt in Cheerio für jQuery-ähnliche Manipulation des DOM.
  • $('.product').each((index, element) => { … }): Iteriert über alle .product-Elemente.
  • $(element).find('.product-name').text().trim(): Extrahiert den Produktnamen.
  • $(element).find('.product-price').text().trim(): Extrahiert den Preis des Produkts.
  • products.push({ name, price }): Fügt die Produktinfos zum products-Array hinzu.
  • console.log(products): Gibt die extrahierten Informationen aus.

*Vollständiges Beispielskript: *
const axios = require('axios');

const cheerio = require('cheerio');

const url = 'http://example-ecommerce.com';

axios.get(url)

.then(response => {

const html = response.data;

const $ = cheerio.load(html);

const products = [];  

$('.product').each((index, element) => {  
  const name = $(element).find('.product-name').text().trim();  
  const price = $(element).find('.product-price').text().trim();  
  products.push({ name, price });  
});  

console.log(products);  
Enter fullscreen mode Exit fullscreen mode

})

.catch(error => {

console.error('Error fetching the page:', error);

});

*Anpassungen für Ihre Zielseite: *

  • Selektoren: Die Selektoren .product, .product-name und .product-price müssen an die tatsächliche HTML-Struktur der Zielseite angepasst werden.
  • Weitere Daten: Für zusätzliche Informationen (z. B. Produktbilder, Links, Beschreibungen) prüfen Sie die entsprechende HTML-Struktur.

Web Scraping-Tool zum Scrapen von Webseiten mit JavaScript

Wenn Sie kürzlich Python, Ruby oder eine andere Programmiersprache für das Web Scraping benötigen, ist Octoparse ein hervorragendes Tool, insbesondere für Webseiten mit JavaScript-Unterstützung.

Nehmen wir ein konkretes Beispiel: Wenn Sie eine Ziel-Webseite haben und mit dem Scraping beginnen möchten, sollten Sie zuerst überprüfen, ob die Seite gegen JS-Scraping gesperrt ist. Verschiedene Webseiten verwenden unterschiedliche Schutzmethoden, und es kann einige Zeit und frustrierende Versuche dauern, bis Sie feststellen, dass etwas nicht stimmt, insbesondere wenn das Scraping nicht die gewünschten Ergebnisse liefert. Mit einem Web-Scraping-Tool verläuft der Datenextraktionsprozess jedoch reibungslos.

Viele Web-Scraping-Tools ersparen Ihnen das Schreiben von Crawlern. Octoparse ist besonders effizient beim Scraping von JavaScript-lastigen Seiten und kann Daten von 99% der Webseiten, einschließlich solcher mit Ajax, extrahieren. Zudem bietet es Captcha-Lösungsdienste an. Octoparse ist kostenlos nutzbar und bietet eine automatische Erkennungsfunktion sowie über 100 benutzerfreundliche Vorlagen, die eine effiziente Datenextraktion ermöglichen. Neue Benutzer können zudem eine 14-tägige Testversion nutzen.

Top comments (0)