Hvis et nettsted ikke klarer å tilby et godt API, er det nest beste alternativet å skrape innholdet. Cheerio og Express.js vil hjelpe deg med å gjøre nettopp det.

Nettskraping er en teknikk som gjør det mulig å hente data fra en bestemt nettside. Nettsteder bruker HTML for å beskrive innholdet. Hvis HTML-en er ren og semantisk, er det lett å bruke den til å finne nyttige data.

Du vil vanligvis bruke en nettskraper for å innhente og overvåke data og spore fremtidige endringer i dem.

jQuery-konsepter som er verdt å vite før du bruker Cheerio

jQuery er en av de mest populære JavaScript-pakkene som finnes. Det gjør det lettere å jobbe med Document Object Model (DOM), håndtere hendelser, animasjoner og mer. Cheerio er en pakke for nettskraping som bygger på toppen av jQuery – som deler samme syntaks og API, samtidig som det gjør det enklere å analysere HTML- eller XML-dokumenter.

Før du lærer hvordan du bruker Cheerio, er det viktig å vite hvordan du velger HTML-elementer med jQuery. Heldigvis støtter jQuery de fleste CSS3-velgere som gjør det lettere å hente elementer fra DOM. Ta en titt på følgende kode:

instagram viewer 

$("#container");

I kodeblokken ovenfor velger jQuery elementene med id av "container". En lignende implementering med vanlig gammel JavaScript vil se omtrent slik ut:

document.querySelectorAll("#container");

Ved å sammenligne de to siste kodeblokkene kan du se at den tidligere kodeblokken er mye lettere å lese enn sistnevnte. Det er det fine med jQuery.

jQuery har også nyttige metoder som tekst(), html(), og flere som gjør det mulig å manipulere HTML-elementer. Det er flere metoder du kan bruke for å krysse DOM, som forelder(), søsken(), forrige(), og neste().

De Hver() metoden i jQuery er veldig populær i mange Cheerio-prosjekter. Den lar deg iterere over objekter og matriser. Syntaksen for Hver() metoden ser slik ut:

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

I kodeblokken ovenfor, Ring tilbake kjører for hver iterasjon av array- eller objektargumentet.

Laster HTML med Cheerio

For å begynne å analysere HTML- eller XML-data med Cheerio, kan du bruke cheerio.load() metode. Ta en titt på dette eksemplet:

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

Denne kodeblokken bruker jQuery tekst() metoden henter tekstinnholdet i h1 element. Den fullstendige syntaksen for laste() metoden ser slik ut:

load(content, options, mode)

De innhold parameter refererer til de faktiske HTML- eller XML-dataene du sender laste() metode. alternativer er et valgfritt objekt som kan endre oppførselen til metoden. Som standard er laste() metoden introduserer html, hode, og kropp elementer hvis de mangler. Hvis du vil stoppe denne atferden, må du sørge for at du angir modus til falsk.

Skraper hackernyheter med Cheerio

Koden som brukes i dette prosjektet er tilgjengelig i en GitHub-depot og er gratis for deg å bruke under MIT-lisensen.

Det er på tide å kombinere alt du har lært så langt og lage en enkel nettskraper. Hacker News er et populært nettsted for gründere og innovatører. Det er også et perfekt nettsted å bruke ferdighetene dine til å skrape nett på fordi det laster raskt, har et veldig enkelt grensesnitt og ikke viser noen annonser.

Sørg for at du har Node.js og Node Package Manager kjører på maskinen din. Opprett en tom mappe, og deretter en package.json fil, og legg til 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"
 }
}

Etter å ha gjort det, åpne terminalen og kjør:

npm i

Dette bør installere de nødvendige avhengighetene du trenger for å bygge skraperen. Disse pakkene inkluderer Cheerio for å analysere HTML, ExpressJS for å lage serveren, og - som en utviklingsavhengighet -Nodemon, et verktøy som lytter etter endringer i prosjektet og starter automatisk serveren på nytt.

Sette opp ting og lage de nødvendige funksjonene

Opprett en index.js fil, og i den filen oppretter du en konstant variabel kalt "PORT". Sett HAVN til 5500 (eller hvilket nummer du velger), og importer deretter henholdsvis Cheerio- og Express-pakkene.

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

Definer deretter tre variabler: url, html, og ferdigside. Sett url til Hacker News URL.

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

Lag nå en funksjon kalt getHeader() som returnerer noe HTML som nettleseren skal gjengi.

functiongetHeader(){
return`

Opprett en annen funksjon getScript() som returnerer noe JavaScript for nettleseren å kjøre. Pass på at du sender inn variabelen type som et argument når du kaller det.

functiongetScript(type){
return`