تحليل واستخراج البيانات باستخدام JavaScript: من المبتدئ إلى المحترف

لماذا تحليل البيانات باستخدام JavaScript إذا كان Python موجودًا؟

مرحبًا يا صديقي! إذا كنت تقرأ هذا النص، فمن المحتمل أنك على دراية بـ Python ومكتباته مثل BeautifulSoup أو Scrapy. لكن ماذا لو واجهت مهمة يعجز عنها Python؟ على سبيل المثال، تحتاج إلى جمع بيانات من موقع مبني بالكامل على React أو Angular. يتم تحميل جميع المعلومات عبر JavaScript، بينما يكون HTML الأصلي فارغًا. هنا يأتي دور JavaScript!

تحليل واستخراج البيانات باستخدام JavaScript ليس مجرد موضة عابرة، بل هو ضرورة ملحة للعمل مع تطبيقات الويب الحديثة. يتيح لك Node.js تشغيل محرك المتصفح مباشرة على الخادم، ومعالجة DOM، والنقر على الأزرار، وانتظار تحميل المحتوى غير المتزامن. في هذه المقالة، سنستعرض الأدوات الحقيقية ونكتب كودًا يمكن استخدامه فورًا في مشاريعك.

هل أنت مستعد لتحويل JavaScript إلى مكنسة كهربائية قوية للبيانات؟ هيا بنا!

الأدوات الرئيسية لاستخراج البيانات باستخدام JavaScript

قبل كتابة الكود، دعنا نتعرف على "المقاتلين" الرئيسيين في ترسانتنا. لتحليل البيانات باستخدام JavaScript، سنستخدم ثلاث ركائز:

\n
• Axios — عميل HTTP لإرسال الطلبات والحصول على كود HTML للصفحات.
\n
• Cheerio — مكتبة سريعة وخفيفة لتحليل HTML تعمل مثل jQuery على الخادم.
\n
• Puppeteer — متصفح كامل بدون واجهة رسومية (Chrome) يمكنه تنفيذ JavaScript، والنقر، والتمرير، والانتظار.
\n

للصفحات الثابتة، سيكون Axios + Cheerio كافيين. إذا كان الموقع يقوم بتحميل البيانات عبر AJAX أو يتطلب تسجيل دخول، فاستخدم Puppeteer. والآن ننتقل إلى التطبيق العملي.

مثال 1: تحليل بسيط لصفحة ثابتة باستخدام Cheerio

لنفترض أننا بحاجة لجمع عناوين الأخبار من موقع يعرض HTML فورًا (بدون ديناميكية). نقوم بتثبيت التبعيات:

npm install axios cheerio

الآن نكتب سكريبتًا لاستخراج جميع عناوين h2 من الصفحة الرئيسية (استبدل الرابط برابط حقيقي):

const axios = require('axios');\nconst cheerio = require('cheerio');\n\nasync function parseStaticPage(url) {\n    try {\n        const { data } = await axios.get(url);\n        const $ = cheerio.load(data);\n\n        const titles = [];\n        $('h2').each((i, el) => {\n            titles.push($(el).text().trim());\n        });\n\n        console.log('العناوين التي تم العثور عليها:');\n        titles.forEach((title, index) => {\n            console.log(`${index + 1}. ${title}`);\n        });\n    } catch (error) {\n        console.error('خطأ في التحليل:', error.message);\n    }\n}\n\nparseStaticPage('https://example.com/news');

هذا الكود هو الأساس الذي يجب أن تبدأ به تعلم استخراج البيانات باستخدام JavaScript. يعمل Cheerio بسرعة البرق، لكنه لا يستطيع تنفيذ السكريبتات. إذا كان الموقع يعرض "جارٍ التحميل..."، تابع القراءة.

مثال 2: تحليل الصفحات الديناميكية باستخدام Puppeteer

الآن تخيل أن البيانات تظهر فقط بعد أن يقوم المستخدم بالتمرير أو النقر على زر "عرض المزيد". لمثل هذه المهام، يعتبر Puppeteer مثاليًا. نقوم بتثبيته:

npm install puppeteer

السيناريو: ندخل إلى صفحة المنتجات، ننتظر 3 ثوانٍ (حتى يتم تحميل JS)، ثم نجمع أسماء المنتجات:

const puppeteer = require('puppeteer');\n\nasync function parseDynamicPage(url) {\n    const browser = await puppeteer.launch({ headless: true });\n    const page = await browser.newPage();\n\n    await page.goto(url, { waitUntil: 'networkidle2' });\n    // انتظار ظهور المحتوى (المحدد .product-title)\n    await page.waitForSelector('.product-title', { timeout: 10000 });\n\n    const items = await page.evaluate(() => {\n        const titles = [];\n        document.querySelectorAll('.product-title').forEach(el => {