אם אתר אינטרנט לא מצליח לספק API טוב, ההימור הטוב הבא שלך הוא לגרד את התוכן שלו. Cheerio, ו-Express.js, יעזרו לך לעשות בדיוק את זה.

גרידה באינטרנט היא טכניקה המאפשרת להשיג נתונים מאתר מסוים. אתרי אינטרנט משתמשים ב-HTML כדי לתאר את התוכן שלהם. אם ה-HTML נקי וסמנטי, קל להשתמש בו כדי לאתר נתונים שימושיים.

בדרך כלל תשתמש במגרד אינטרנט כדי להשיג ולנטר נתונים ולעקוב אחר שינויים עתידיים בהם.

מושגי jQuery שכדאי להכיר לפני השימוש ב-Cherio

jQuery היא אחת מחבילות ה-JavaScript הפופולריות ביותר שקיימות. זה מקל על העבודה עם מודל אובייקט מסמך (DOM), לטפל באירועים, אנימציה ועוד. Cheerio היא חבילה לגרידת רשת שמתבססת על jQuery - חולקת את אותו תחביר ו-API, תוך שהיא מקלה על ניתוח מסמכי HTML או XML.

לפני שאתה לומד כיצד להשתמש ב-Cheerio, חשוב לדעת כיצד לבחור רכיבי HTML עם jQuery. למרבה המזל, jQuery תומך ברוב בוררי ה-CSS3 מה שמקל על תפיסת אלמנטים מה-DOM. תסתכל על הקוד הבא:

$("#container");

בגוש הקוד למעלה, jQuery בוחר את האלמנטים עם ה- תְעוּדַת זֶהוּת של "מיכל". יישום דומה באמצעות JavaScript ישן רגיל ייראה בערך כך:

instagram viewer 
document.querySelectorAll("#container");

בהשוואה בין שני בלוקי הקוד האחרונים, אתה יכול לראות שבלוק הקוד הקודם הוא הרבה יותר קל לקריאה מאשר האחרון. זה היופי של jQuery.

ל-jQuery יש גם שיטות שימושיות כמו טֶקסט(), html(), ועוד שמאפשרים לבצע מניפולציות על רכיבי HTML. ישנן מספר שיטות שבהן אתה יכול להשתמש כדי לעבור את ה-DOM, כמו הוֹרֶה(), אחים(), prev(), ו הַבָּא().

ה כל אחד() השיטה ב-jQuery פופולרית מאוד בפרויקטים רבים של Cheerio. זה מאפשר לך לחזור על אובייקטים ומערכים. התחביר עבור ה כל אחד() השיטה נראית כך:

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

בגוש הקוד למעלה, התקשר חזרה פועל עבור כל איטרציה של ארגומנט המערך או האובייקט.

טוען HTML עם Cheerio

כדי להתחיל לנתח נתוני HTML או XML עם Cheerio, אתה יכול להשתמש ב- cheerio.load() שיטה. תסתכל על הדוגמה הזו:

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

בלוק קוד זה משתמש ב-jQuery טֶקסט() השיטה מאחזרת את תוכן הטקסט של h1 אֵלֵמֶנט. התחביר המלא עבור לִטעוֹן() השיטה נראית כך:

load(content, options, mode)

ה תוֹכֶן פרמטר מתייחס לנתוני HTML או XML בפועל שאתה מעביר את לִטעוֹן() שיטה. אפשרויות הוא אובייקט אופציונלי שיכול לשנות את התנהגות השיטה. כברירת מחדל, ה לִטעוֹן() השיטה מציגה html, רֹאשׁ, ו גוּף אלמנטים אם הם חסרים. אם אתה רוצה להפסיק את ההתנהגות הזו, ודא שאתה מגדיר מצב לשווא.

גירוד חדשות האקר עם Cheerio

הקוד המשמש בפרויקט זה זמין ב-a מאגר GitHub והוא בחינם עבורך לשימוש תחת רישיון MIT.

זה הזמן לשלב את כל מה שלמדת עד כה וליצור מגרד אינטרנט פשוט. האקר ניוז הוא אתר פופולרי ליזמים ולחדשנים. זהו גם אתר מושלם לרתום את כישורי גירוד האינטרנט שלך מכיוון שהוא נטען מהר, יש לו ממשק פשוט מאוד ואינו מציג פרסומות.

ודא שיש לך Node.js וה מנהל חבילות צומת פועל על המכונה שלך. צור תיקיה ריקה ולאחר מכן א package.json קובץ, והוסיפו את ה-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"
 }
}

לאחר שתעשה זאת, פתח את הטרמינל והפעל:

npm i

זה אמור להתקין את התלות הדרושה לך כדי לבנות את המגרד. חבילות אלה כוללות Cheerio לניתוח ה-HTML, ExpressJS ליצירת השרת, ו-כתלות בפיתוח-Nodemon, כלי עזר שמקשיב לשינויים בפרויקט ומפעיל מחדש את השרת באופן אוטומטי.

הגדרת דברים ויצירת הפונקציות הדרושות

ליצור index.js קובץ, ובקובץ זה, צור משתנה קבוע בשם "PORT". מַעֲרֶכֶת נמל ל-5500 (או כל מספר שתבחר), ואז ייבא את החבילות Cheerio ו-Express בהתאמה.

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

לאחר מכן, הגדר שלושה משתנים: כתובת אתר, html, ו דף סיים. מַעֲרֶכֶת כתובת אתר לכתובת האתר של האקר ניוז.

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

כעת צור פונקציה בשם getHeader() שמחזיר קצת HTML שהדפדפן צריך לעבד.

functiongetHeader(){
return`

ליצור פונקציה נוספת getScript() שמחזיר קצת JavaScript להפעלת הדפדפן. ודא שאתה עובר את המשתנה סוּג כטיעון כשאתה קורא לזה.

functiongetScript(type){
return`