Hvis et websted ikke leverer en god API, er dit næste bedste bud at skrabe dets indhold. Cheerio og Express.js vil hjælpe dig med at gøre netop det.

Web scraping er en teknik, der gør det muligt at indhente data fra en bestemt hjemmeside. Websites bruger HTML til at beskrive deres indhold. Hvis HTML'en er ren og semantisk, er det let at bruge den til at finde nyttige data.

Du vil typisk bruge en webskraber til at indhente og overvåge data og spore fremtidige ændringer af dem.

jQuery-koncepter, der er værd at vide, før du bruger Cheerio

jQuery er en af ​​de mest populære JavaScript-pakker, der findes. Det gør det nemmere at arbejde med Document Object Model (DOM), håndtere begivenheder, animation og meget mere. Cheerio er en pakke til web-skrabning, der bygger oven på jQuery – deler den samme syntaks og API, samtidig med at det gør det nemmere at parse HTML- eller XML-dokumenter.

Før du lærer at bruge Cheerio, er det vigtigt at vide, hvordan du vælger HTML-elementer med jQuery. Heldigvis understøtter jQuery de fleste CSS3-vælgere, hvilket gør det lettere at få fat i elementer fra DOM. Tag et kig på følgende kode:

instagram viewer 

$("#container");

I kodeblokken ovenfor vælger jQuery elementerne med id af "container". En lignende implementering ved hjælp af almindelig gammel JavaScript ville se sådan ud:

document.querySelectorAll("#container");

Ved at sammenligne de sidste to kodeblokke kan du se, at den førstnævnte kodeblok er meget nemmere at læse end sidstnævnte. Det er det smukke ved jQuery.

jQuery har også nyttige metoder som tekst(), html(), og mere, der gør det muligt at manipulere HTML-elementer. Der er flere metoder, du kan bruge til at krydse DOM, f.eks forælder(), søskende(), forrige(), og Næste().

Det hver() metode i jQuery er meget populær i mange Cheerio-projekter. Det giver dig mulighed for at iterere over objekter og arrays. Syntaksen for hver() metoden ser sådan ud:

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

I kodeblokken ovenfor, ring tilbage kører for hver iteration af array- eller objektargumentet.

Indlæser HTML med Cheerio

For at begynde at parse HTML- eller XML-data med Cheerio kan du bruge cheerio.load() metode. Tag et kig på dette eksempel:

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

Denne kodeblok bruger jQuery tekst() metoden henter tekstindholdet i h1 element. Den fulde syntaks for belastning() metoden ser sådan ud:

load(content, options, mode)

Det indhold parameter refererer til de faktiske HTML- eller XML-data, du videregiver belastning() metode. muligheder er et valgfrit objekt, der kan ændre metodens adfærd. Som standard er belastning() metode introducerer html, hoved, og legeme elementer, hvis de mangler. Hvis du vil stoppe denne adfærd, skal du sørge for at indstille mode til falsk.

Skrabning af hacker-nyheder med Cheerio

Koden brugt i dette projekt er tilgængelig i en GitHub-depot og er gratis for dig at bruge under MIT-licensen.

Det er tid til at kombinere alt, hvad du har lært indtil nu, og skabe en simpel webskraber. Hacker News er en populær hjemmeside for iværksættere og innovatører. Det er også et perfekt websted at udnytte dine web-skrabefærdigheder på, fordi det indlæses hurtigt, har en meget enkel grænseflade og ikke viser nogen annoncer.

Sørg for, at du har Node.js og Node Package Manager kører på din maskine. Opret en tom mappe, og derefter en package.json fil, og tilføj følgende JSON i filen:

{
"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"
 }
}

Når du har gjort det, skal du åbne terminalen og køre:

npm i

Dette bør installere de nødvendige afhængigheder, du har brug for til at bygge skraberen. Disse pakker inkluderer Cheerio til at analysere HTML, ExpressJS til oprettelse af serveren og - som en udviklingsafhængighed -Nodemon, et værktøj, der lytter efter ændringer i projektet og genstarter automatisk serveren.

Opsætning af ting og oprettelse af de nødvendige funktioner

Opret en index.js fil, og i den fil skal du oprette en konstant variabel kaldet "PORT". Sæt HAVN til 5500 (eller hvilket nummer du vælger), og importer derefter henholdsvis Cheerio- og Express-pakkerne.

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

Dernæst skal du definere tre variable: url, html, og færdige side. Sæt url til Hacker News URL.

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

Opret nu en funktion kaldet getHeader() der returnerer noget HTML, som browseren skal gengive.

functiongetHeader(){
return`

Opret en anden funktion getScript() der returnerer noget JavaScript, som browseren kan køre. Sørg for at indtaste variablen type som et argument, når man kalder det.

functiongetScript(type){
return`