Ak webová stránka neposkytuje dobré rozhranie API, ďalším najlepším riešením je zoškrabať jej obsah. Cheerio a Express.js vám s tým pomôžu.
Web scraping je technika, ktorá umožňuje získať údaje z konkrétnej webovej stránky. Webové stránky používajú HTML na popis svojho obsahu. Ak je kód HTML čistý a sémantický, je ľahké ho použiť na vyhľadanie užitočných údajov.
Na získavanie a monitorovanie údajov a sledovanie budúcich zmien v nich zvyčajne použijete webový škrabák.
Koncepty jQuery, ktoré stojí za to poznať predtým, ako použijete Cheerio
jQuery je jedným z najpopulárnejších balíčkov JavaScriptu. Uľahčuje prácu s Model objektu dokumentu (DOM), spracovávať udalosti, animácie a ďalšie. Cheerio je balík pre web scraping, ktorý stavia na jQuery – zdieľa rovnakú syntax a API, pričom uľahčuje analýzu HTML alebo XML dokumentov.
Predtým, ako sa naučíte používať Cheerio, je dôležité vedieť, ako vybrať prvky HTML pomocou jQuery. Našťastie jQuery podporuje väčšinu selektorov CSS3, čo uľahčuje získavanie prvkov z DOM. Pozrite sa na nasledujúci kód:
$("#container");
Vo vyššie uvedenom bloku kódu jQuery vyberie prvky s id „kontajnera“. Podobná implementácia pomocou bežného starého JavaScriptu by vyzerala asi takto:
document.querySelectorAll("#container");
Pri porovnaní posledných dvoch blokov kódu môžete vidieť, že prvý blok kódu je oveľa ľahšie čitateľný ako druhý. To je krása jQuery.
jQuery má tiež užitočné metódy ako text(), html()a ďalšie, ktoré umožňujú manipulovať s prvkami HTML. Existuje niekoľko metód, ktoré môžete použiť na prechádzanie DOM, napr rodič(), súrodenci(), predchádzajúci(), a Ďalšie().
The každý() metóda v jQuery je veľmi populárna v mnohých projektoch Cheerio. Umožňuje vám iterovať objekty a polia. Syntax pre každý() metóda vyzerá takto:
$().each(<arrayorobject>, callback)
Vo vyššie uvedenom bloku kódu zavolaj späť beží pre každú iteráciu argumentu poľa alebo objektu.
Načítavanie HTML pomocou Cheerio
Ak chcete začať analyzovať údaje HTML alebo XML pomocou Cheerio, môžete použiť cheerio.load() metóda. Pozrite si tento príklad:
const $ = cheerio.load('Hello, world!
');
console.log($('h1').text())
Tento blok kódu používa jQuery text() metóda načíta textový obsah h1 element. Úplná syntax pre naložiť() metóda vyzerá takto:
load(content, options, mode)
The obsahu Parameter odkazuje na skutočné údaje HTML alebo XML, ktoré odovzdávate naložiť() metóda. možnosti je voliteľný objekt, ktorý môže modifikovať správanie metódy. V predvolenom nastavení je naložiť() metóda zavádza html, hlavu, a telo prvky, ak chýbajú. Ak chcete zastaviť toto správanie, uistite sa, že ste nastavili režim na falošné.
Zoškrabovanie hackerských správ s Cheerio
Kód použitý v tomto projekte je dostupný v a úložisko GitHub a môžete ho bezplatne používať na základe licencie MIT.
Je čas spojiť všetko, čo ste sa doteraz naučili, a vytvoriť jednoduchý webový škrabák. Hacker News je populárna webová stránka pre podnikateľov a inovátorov. Je to tiež perfektná webová stránka, na ktorej môžete využiť svoje schopnosti zoškrabovania webu, pretože sa rýchlo načítava, má veľmi jednoduché rozhranie a nezobrazuje žiadne reklamy.
Uistite sa, že máte Node.js a Správca balíkov uzlov beží na vašom stroji. Vytvorte prázdny priečinok a potom a package.json a do súboru pridajte nasledujúci JSON:
{
"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"
}
}
Potom otvorte terminál a spustite:
npm i
Toto by malo nainštalovať potrebné závislosti, ktoré potrebujete na zostavenie škrabky. Tieto balíky zahŕňajú Cheerio na analýzu HTML, ExpressJS na vytvorenie servera a – ako vývojovú závislosť –Nodemon, nástroj, ktorý počúva zmeny v projekte a automaticky reštartuje server.
Nastavenie vecí a vytváranie potrebných funkcií
Vytvorte index.js súbor a v tomto súbore vytvorte konštantnú premennú s názvom „PORT“. Set PORT na 5500 (alebo akékoľvek číslo, ktoré si vyberiete), potom importujte balíčky Cheerio a Express.
const PORT = 5500;
const cheerio = require("cheerio");
const express = require("express");
const app = express();
Ďalej definujte tri premenné: url, html, a hotová stránka. Set url na Hacker News URL.
const url = 'https://news.ycombinator.com';
let html;
let finishedPage;
Teraz vytvorte funkciu s názvom getHeader() ktorý vráti nejaké HTML, ktoré by mal prehliadač vykresliť.
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>
`}
Vytvorenie ďalšej funkcie getScript() ktorý prehliadaču vráti nejaký JavaScript na spustenie. Uistite sa, že zadáte premennú typu ako argument, keď to nazveš.
functiongetScript(type){
return`