Il web scraping è una tecnica che consente di ottenere dati da un determinato sito web. I siti Web utilizzano l'HTML per descrivere il loro contenuto. Se l'HTML è pulito e semantico, è facile usarlo per individuare dati utili.

In genere utilizzerai un web scraper per ottenere e monitorare i dati e tenere traccia delle modifiche future ad essi.

Concetti jQuery che vale la pena conoscere prima di utilizzare Cheerio

jQuery è uno dei pacchetti JavaScript più popolari esistenti. Rende più facile lavorare con il Document Object Model (DOM), gestire eventi, animazioni e altro ancora. Cheerio è un pacchetto per il web scraping che si basa su jQuery, condividendo la stessa sintassi e API, semplificando al contempo l'analisi di documenti HTML o XML.

Prima di imparare a usare Cheerio, è importante sapere come selezionare gli elementi HTML con jQuery. Per fortuna, jQuery supporta la maggior parte dei selettori CSS3, il che semplifica l'acquisizione di elementi dal DOM. Dai un'occhiata al seguente codice:

$("#container");

Nel blocco di codice sopra, jQuery seleziona gli elementi con il id di "contenitore". Un'implementazione simile utilizzando il normale vecchio JavaScript sarebbe simile a questa:

document.querySelectorAll("#container");

Confrontando gli ultimi due blocchi di codice, puoi vedere che il primo blocco di codice è molto più facile da leggere rispetto al secondo. Questa è la bellezza di jQuery.

jQuery ha anche metodi utili come testo(), html()e altro ancora che consentono di manipolare gli elementi HTML. Esistono diversi metodi che puoi utilizzare per attraversare il DOM, ad esempio genitore(), fratelli(), prec(), E Prossimo().

IL ogni() Il metodo in jQuery è molto popolare in molti progetti Cheerio. Ti consente di iterare su oggetti e array. La sintassi per il ogni() il metodo si presenta così:

$().each(<arrayorobject>, callback)

Nel blocco di codice sopra, richiamare viene eseguito per ogni iterazione dell'array o dell'argomento dell'oggetto.

Caricamento di HTML con Cheerio

Per iniziare l'analisi dei dati HTML o XML con Cheerio, puoi utilizzare il file cheerio.load() metodo. Dai un'occhiata a questo esempio:

const $ = cheerio.load('
Hello, world!
');
console.log($('h1').text())

Questo blocco di codice usa jQuery testo() Il metodo recupera il contenuto di testo del file h1 elemento. La sintassi completa per il carico() il metodo si presenta così:

load(content, options, mode)

IL contenuto Il parametro si riferisce ai dati HTML o XML effettivi che passi carico() metodo. opzioni è un oggetto facoltativo che può modificare il comportamento del metodo. Per impostazione predefinita, il carico() metodo introduce html, Testa, E corpo elementi se mancano. Se vuoi interrompere questo comportamento, assicurati di impostare modalità a falso.

Raschiare le notizie sugli hacker con Cheerio

È ora di combinare tutto ciò che hai imparato finora e creare un semplice web scraper. Hacker News è un popolare sito Web per imprenditori e innovatori. È anche un sito Web perfetto su cui sfruttare le tue abilità di web scraping perché si carica velocemente, ha un'interfaccia molto semplice e non pubblica alcuna pubblicità.

Assicurati di avere Node.js e il Gestore pacchetti nodo in esecuzione sulla tua macchina. Crea una cartella vuota, quindi a pacchetto.json file e aggiungi il seguente JSON all'interno del file:

{
"name": "web-scraper",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "nodemon index.js"
 },
"author": "",
"license": "MIT",
"dependencies": {
"cheerio": "^1.0.0-rc.12",
"express": "^4.18.2"
 },
"devDependencies": {
"nodemon": "^3.0.1"
 }
}

Dopo averlo fatto, apri il terminale ed esegui:

npm i

Questo dovrebbe installare le dipendenze necessarie per costruire lo scraper. Questi pacchetti includono Cheerio per l'analisi dell'HTML, ExpressJS per la creazione del server e, come dipendenza di sviluppo,Nodemon, un'utilità che ascolta le modifiche nel progetto e riavvia automaticamente il server.

Impostare le cose e creare le funzioni necessarie

Creare un index.js file e, in quel file, creare una variabile costante chiamata "PORT". Impostato PORTA a 5500 (o qualsiasi numero tu scelga), quindi importa rispettivamente i pacchetti Cheerio ed Express.

const PORT = 5500;
const cheerio = require("cheerio");
const express = require("express");
const app = express();

Quindi, definisci tre variabili: URL, html, E finitoPagina. Impostato URL all'URL di Hacker News.

const url = 'https://news.ycombinator.com';
let html;
let finishedPage;

Ora crea una funzione chiamata getHeader() che restituisce del codice HTML che il browser dovrebbe visualizzare.

functiongetHeader(){
return`
"display: flex; flex-direction: column; align-items: center;">
"text-transform: capitalize">Scraper News</h1>
"display: flex; gap: 10px; align-items: center;">
"/" id="news" onClick='showLoading()'>Home</a>
"/best" id="best" onClick='showLoading()'>Best</a>
"/newest" id="newest" onClick='showLoading()'>Newest</a>
"/ask" id="ask" onClick='showLoading()'>Ask</a>
"/jobs" id="jobs" onClick='showLoading()'>Jobs</a>
 </div>
class="loading" style="display: none;">Loading...</p>
 </div>
`}

Il creare un'altra funzione getScript() che restituisce del codice JavaScript per l'esecuzione del browser. Assicurati di passare la variabile tipo come argomento quando lo chiami.

functiongetScript(type){
return`