סקרפינג - מהבסיס עד לסקרפינג בסקייל

למה בכלל צריך את זה?

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

ישנם מספר מקורות מהם אנחנו יכולים להביא דאטה לאתר/ אפליקציה שלנו

1.  api חיצוני
2.  בניית מערכת שמאפשרת למשתמשים להכניס את הדאטה בעצמם
3.  הזנת הדאטה על ידי המפתח או נותן השירות
4.  סקרפינג

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

 

איך עושים את זה?

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

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

העבודה מחולקת ל3 שלבים-
1. מציאת  האלמנטים של דף האינטרט מהם אנחנו רוצים לדלות את המידע, וכתיבת הסקריפט שמביא את המידע הרצוי.
2. הפיכת התהליך לאוטומטי בעזרת חבילה כלשהי.
3. סידור הנתונים שהתקבלו והכנסתם לDB, או כל שימוש אחר.

 

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

בחלק זה ניתקל באתגרים, כאשר מפתחי האתר השתמשו בid מג'ונרט או בclass שמשותף עם הרבה אלמנטים אחרים בדף, מה שיקשה עלינו להגיע לאלמנט אותו אנחנו מחפשים. במקרה כזה נצטרך למצוא דברים אחרים שמייחדים את האלמנט, נוכל להתייחס לאלמנט כסטרינג בעזרת outer או innerHTML ולהפעיל עליו פונקציות שונות או לרוץ עליו בלולאה.
כאן זה הזמן להתחיל לחדד יכולות בregular expression (מי שלא מכיר מומלץ).

דוגמא:

כתבתי כאן קטע קוד שניתן להריץ מהconsole ממש כאן בדף הזה של הפוסט
הרצה של הפונקציה doBasicScrape תחזיר אובייקט הכולל את כותרת הפוסט, שם המחבר, הurl של התמונה והודעה סודית ממני
תוכלו להעתיק את הקוד כמו שהוא לקונסול ולראות איך זה עובד

 

function doBasicScrape(){
    const title = document.querySelector('.main-title').innerText
    const mainDiv = document.querySelector('.Layout_main__cgm7e')
    const authorSpan = mainDiv.querySelector('span').innerText
    const author = authorSpan.split('מחבר ')[1]
    const img = document.querySelector('.main-img').src
    const secretMassage = mainDiv.querySelector('.secret-massage').innerHTML
    return {title,author,img,secretMassage}
}
const scrapeResults = doBasicScrape()
console.log(scrapeResults)

 

 

השלב השני

אחרי שכתבנו את הסקריפט שמביא לנו את כל הדאטה הרצוי

נצטרך לבנות את השרת שיביא לנו את הדאטה בצורה אוטומטית. לשם כך האקוסיסטם הנפלא של JS מספק לנו המון כלים מוכנים open source, כמו לדוגמא: cheerio , jsdom וpuppeteer.

cheerio וjsdom נותנות לנו שירות די דומה, אחרי שמשכנו קובץ html בקריאת http פשוטה מתוך שרת הnode.js שלנו, נוכל להריץ עליו את הסקריפט שבנינו בשלב הראשון בinspect

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

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

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

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

האתגרים:

מעולה, למדנו איך מתבצע תהליך הסקרפינג
אבל, ביננו כל מי שעשה פעם סקרפינג יודע שישנם עוד הרבה אתגרים בדרך-

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

1.  קאפצ'ות- אותם קטעי טקסט מטושטשים, שאתם צריכים לפעמים לפענח כדי להזדהות כלא רובוטים.
2.  גישה לאתר רק לאחר אוטנטיקציה.
3.  כפתורים שלא ניתנים ללחיצה על ידי סקריפט (שימוש בפרופרטי isTrust).
4.  חסימת משתמשים חשודים.

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

פתרונות:
יש שני כלים שמומלץ לשקול שימוש שלהם כאשר אנחנו מתכננים לבצע סקרפינג בסקייל

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

2. api נגד קאפצ'ות - ישנם שירותים שמאפשרים לך לשלוח את התמונה של הקאפצ'ה. בצד השני של הAPI יושבים עובדים אמיתיים שפותרים את הקאפצ'ה עבורך, בזמן קצר מאוד ועבור תשלום מועט.

עוד עצות
במהלך החיפוש שלי למציאת פתרון לבעיית הקאפצ'ות, קיבלתי עוד עצות מעניינות שלא יצא לי להשתמש בהם, אציין אותם כאן-
1. robots.txt - ניתן להימנע מקאפצ'ות על ידי עבודה לפי קובץ robots.txt. זהו קובץ שאתרים מספקים ובו מופיעים הקריטריונים לפיהם הם מרשים לבצע crawling על האתר. לפי מה שהבנתי, הקובץ אמור להגדיר גם לזחלנים של גוגל ומנועי החיפוש, כיצד לסרוק את האתר. אם כן, כדאי לנסות להימנע ממה שהם מבקשים לא לעשות. לא ניסיתי, כך הומלץ. 

2. עוד פתרון מקורי שהוצע לי היה כזה- במקרים מסויימים יחד עם התמונה מופיעה אפשרות לשמוע את תוכן הקאפצ'ה. מה שצריך לעשות אם כן, זה להוריד את קובץ השמע, לשלוח אותו לapi שממיר שמע לטקסט, ולהזין את השדה בטקסט שהתקבל (תודה ל Jenya Leonti)
 

למה אני ממליץ ללמוד לעשות סקרפינג?
חוץ מהתועלת העיקרית של הסקרפינג, שהיא הזנת הדאטה בייס שלנו, מאוד נהניתי באופן אישי מכתיבת סקרייפרים והמניפולציות על הdom.
אני מרגיש שזה שיפר את היכולות שלי בjs, כי נפגשתי בעוד שימוש של השפה ובעוד אספקטים שלה. כמו כן יצא לי לפתח עוד כלים לעצמי שכוללים את הטכנולוגיות האלה, ולהכיר יותר טוב את הDOM Api.

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

זה אגב הפוסט עליו קיבלתי הרבה תשובות ועצות בנוגע לאתגרים בסקרפינג בקבוצת "עושים תוכנה" - קישור

וזה סרטון של כלי שבניתי שמתחבר ל80 מפתחים בלינקדאין בצורה חכמה - קישור

סקרפינג נעים!
אחיה