Dacă un site web nu reușește să ofere un API bun, următorul cel mai bun pariu este să-i răzuiești conținutul. Cheerio și Express.js vă vor ajuta să faceți exact asta.
Web scraping este o tehnică care face posibilă obținerea de date de pe un anumit site web. Site-urile web folosesc HTML pentru a-și descrie conținutul. Dacă HTML-ul este curat și semantic, este ușor să îl utilizați pentru a localiza date utile.
De obicei, veți folosi un web scraper pentru a obține și monitoriza date și pentru a urmări modificările viitoare ale acestora.
Concepte jQuery care merită cunoscute înainte de a utiliza Cheerio
jQuery este unul dintre cele mai populare pachete JavaScript existente. Face mai ușor să lucrezi cu Document Object Model (DOM), gestionați evenimente, animații și multe altele. Cheerio este un pachet pentru web scraping care se bazează pe jQuery - partajând aceeași sintaxă și API, facilitând în același timp analizarea documentelor HTML sau XML.
Înainte de a învăța cum să folosești Cheerio, este important să știi cum să selectezi elemente HTML cu jQuery. Din fericire, jQuery acceptă majoritatea selectoarelor CSS3, ceea ce facilitează preluarea elementelor din DOM. Aruncă o privire la următorul cod:
$("#container");
În blocul de cod de mai sus, jQuery selectează elementele cu id de „container”. O implementare similară folosind JavaScript vechi obișnuit ar arăta cam așa:
document.querySelectorAll("#container");
Comparând ultimele două blocuri de cod, puteți vedea că fostul bloc de cod este mult mai ușor de citit decât cel din urmă. Aceasta este frumusețea jQuery.
jQuery are și metode utile precum text(), html(), și multe altele care fac posibilă manipularea elementelor HTML. Există mai multe metode pe care le puteți folosi pentru a traversa DOM, cum ar fi mamă(), fratii(), prev(), și Următorul().
The fiecare() metoda din jQuery este foarte populară în multe proiecte Cheerio. Vă permite să iterați peste obiecte și matrice. Sintaxa pentru fiecare() metoda arata asa:
$().each(<arrayorobject>, callback)
În blocul de cod de mai sus, sună din nou rulează pentru fiecare iterație a matricei sau a argumentului obiectului.
Se încarcă HTML cu Cheerio
Pentru a începe analizarea datelor HTML sau XML cu Cheerio, puteți utiliza cheerio.load() metodă. Aruncă o privire la acest exemplu:
const $ = cheerio.load('Hello, world!
');
console.log($('h1').text())
Acest bloc de cod folosește jQuery text() metoda preia conținutul text al h1 element. Sintaxa completă pentru sarcină() metoda arata asa:
load(content, options, mode)
The conţinut parametrul se referă la datele HTML sau XML reale pe care le transmiteți sarcină() metodă. Opțiuni este un obiect opțional care poate modifica comportamentul metodei. În mod implicit, sarcină() metoda introduce html, cap, și corp elemente dacă lipsesc. Dacă doriți să opriți acest comportament, asigurați-vă că ați setat modul la fals.
Scraping Hacker News With Cheerio
Codul folosit în acest proiect este disponibil în a Depozitul GitHub și este gratuit pentru utilizare sub licența MIT.
Este timpul să combinați tot ce ați învățat până acum și să creați un simplu web scraper. Hacker News este un site web popular pentru antreprenori și inovatori. Este, de asemenea, un site perfect pentru a vă valorifica abilitățile de web scraping, deoarece se încarcă rapid, are o interfață foarte simplă și nu difuzează reclame.
Asigurați-vă că aveți Node.js si Manager de pachete Node rulează pe mașina dvs. Creați un folder gol, apoi a pachet.json fișier și adăugați următorul JSON în interiorul fișierului:
{
"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"
}
}
După ce faceți asta, deschideți terminalul și rulați:
npm i
Acest lucru ar trebui să instaleze dependențele necesare de care aveți nevoie pentru a construi scraperul. Aceste pachete includ Cheerio pentru analiza HTML, ExpressJS pentru crearea serverului și, ca dependență de dezvoltare,Nodemon, un utilitar care ascultă modificări în proiect și repornește automat serverul.
Configurarea lucrurilor și crearea funcțiilor necesare
Creaza un index.js fișier și, în acel fișier, creați o variabilă constantă numită „PORT”. A stabilit PORT la 5500 (sau orice număr alegeți), apoi importați pachetele Cheerio și, respectiv, Express.
const PORT = 5500;
const cheerio = require("cheerio");
const express = require("express");
const app = express();
Apoi, definiți trei variabile: url, html, și Pagina terminată. A stabilit url la adresa URL a Hacker News.
const url = 'https://news.ycombinator.com';
let html;
let finishedPage;
Acum creați o funcție numită getHeader() care returnează un cod HTML pe care browserul ar trebui să îl redeze.
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>
`}
Creați o altă funcție getScript() care returnează ceva JavaScript pentru ca browserul să ruleze. Asigurați-vă că treceți variabila tip ca argument când îl numești.
functiongetScript(type){
return`