تجريف الويب باستخدام Node.js ومحرر العرائس

برنامج تعليمي تمهيدي قصير عن تجريف الويب

Web Scraping هي مهمة تنزيل صفحة ويب واستخراج نوع من المعلومات منها.

لقد قمت مؤخرًا بمشروع صغير باستخدام لوحة Arduino مع شاشة LCD مرفقة. باستخدام Johnny-Five ، الذي يتيح لنا برمجة Arduino باستخدام Node.js ، كنت أرغب في إحضار درجة الحرارة المقاسة أعلى الجبل ، وإظهارها على لوحة Arduino.

إستعملتمحرك العرائسللقيام بمهمة القشط. محرك العرائس هو أداة رائعة تم إنشاؤها بواسطة Google. إنها مكتبة Node يمكننا استخدامها للتحكم في مثيل Chrome بدون رأس.

هذا يعني أننا نستخدم Chrome بشكل أساسي ، ولكن بشكل برمجي.

هناك العديد من الاستخدامات العملية لـ Puppeteer ، بما في ذلك أتمتة الاختبار ، وعمل لقطات شاشة ، وإنشاء إصدارات معروضة من جانب الخادم لتطبيقات الصفحة الواحدة ، والمزيد.

ابدأ بتثبيته باستخدام

npm install puppeteer

في ملف Node.js ، اطلبه:

const puppeteer = require('puppeteer');

ثم يمكننا استخدامlaunch()طريقة لإنشاء مثيل متصفح:

(async () => {
  const browser = await puppeteer.launch()
})()

نحن نستخدمawait، ولذا يجب أن نلف استدعاء هذا الأسلوب في ملفوظيفة غير متزامنةالتي نحناستدعاء على الفور.

بعد ذلك يمكننا استخدامnewPage()طريقة علىbrowserكائن للحصول علىpageموضوع:

(async () => {
  const browser = await puppeteer.launch()
  const page = await browser.newPage()
})()

بعد ذلك نسميgoto()طريقة علىpageكائن لتحميل تلك الصفحة:

(async () => {
  const browser = await puppeteer.launch()
  const page = await browser.newPage()
  await page.goto('https://website.com')
})()

أخيرًا ، يمكننا الحصول على الصفحةالمحتوىاستدعاءevaluate()طريقةpage. تأخذ هذه الطريقة وظيفة نداء حيث يمكننا إضافة الكود المطلوب لاسترداد عناصر الصفحة التي نحتاجها. يتم تنفيذ الوظيفة في سياق الصفحة ، حتى نتمكن من الوصول إليهاdocumentوجميع واجهات برمجة تطبيقات المتصفح. نعيد كائنًا جديدًا ، وستكون هذه نتيجةevaluate()طريقة الاتصال.

يمكننا استخداممحددات APIواسترداد البيانات من الصفحة.

(async () => {
  const browser = await puppeteer.launch()
  const page = await browser.newPage()
  await page.goto('https://website.com')
<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">result</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">await</span> <span style="color:#a6e22e">page</span>.<span style="color:#a6e22e">evaluate</span>(() =&gt; {
<span style="color:#75715e">//...

}) })()

دعنا نصل إلى المشكلة الخاصة التي لدي. هذه هي الصفحة التي تستضيف محطة الأرصاد الجوية الواقعة على قمة جبل على ارتفاع 3315 م:http://www.meteocentrale.ch/it/europa/svizzera/meteo-corvatsch/details/S067910/

اريد الحصول على ذلك-9°Cنص. باستخدام فاحص المتصفح يمكنني أن أرى أنه يحتوي على ملفcolumn-4فئة المرفقة. إنه ليس اسم فئة مثالي ، لأنه ليس له معنى ، وقد يتغير إذا قرروا إضافة عمود جديد ، ولكن هذا ما حصلنا عليه:

هذا هو الرمز الكامل حتى الآن:

const puppeteer = require('puppeteer');

(async () => { const browser = await puppeteer.launch() const page = await browser.newPage() await page.goto(http://www.meteocentrale.ch/it/europa/svizzera/meteo-corvatsch/details/S067910/)

<span style="color:#66d9ef">const</span> <span style="color:#a6e22e">result</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">await</span> <span style="color:#a6e22e">page</span>.<span style="color:#a6e22e">evaluate</span>(() =&gt; {
  <span style="color:#66d9ef">let</span> <span style="color:#a6e22e">temperature</span> <span style="color:#f92672">=</span> document.<span style="color:#a6e22e">querySelector</span>(<span style="color:#e6db74">'.column-4'</span>).<span style="color:#a6e22e">innerText</span>
<span style="color:#66d9ef">return</span> {
    <span style="color:#a6e22e">temperature</span>
  }

})

console.log(result)

browser.close() })()

إذا قمنا بتشغيل هذا الرمز ،resultسيكون لها هذه القيمة:

{
  temperature: '-9°C'
}

أو مهما كانت درجة الحرارة الآن.