Pengikisan Web Dipermudahkan: Parsing Mana-mana Halaman HTML dengan Puppeteer

Bayangkan membina platform e-dagang di mana kita boleh dengan mudah mengambil data produk dalam masa nyata dari kedai utama seperti eBay, Amazon dan Flipkart. Sudah tentu, terdapat Shopify dan perkhidmatan yang serupa, tetapi jujurlah—ia boleh berasa agak menyusahkan untuk membeli langganan hanya untuk projek. Jadi, saya fikir, mengapa tidak mengikis tapak ini dan menyimpan produk terus dalam pangkalan data kami? Ini akan menjadi cara yang cekap dan kos efektif untuk mendapatkan produk untuk projek e-dagang kami.

Apakah Web Scraping?

Pengikisan web melibatkan pengekstrakan data daripada tapak web dengan menghuraikan HTML halaman web untuk membaca dan mengumpul kandungan. Ia selalunya melibatkan mengautomasikan penyemak imbas atau menghantar permintaan HTTP ke tapak, dan kemudian menganalisis struktur HTML untuk mendapatkan semula cebisan maklumat tertentu seperti teks, pautan atau imej. Puppeteer ialah satu perpustakaan yang digunakan untuk mengikis tapak web.

?Apa itu Puppeteer?

Puppeteer ialah perpustakaan Node.js. Ia menyediakan API peringkat tinggi untuk mengawal penyemak imbas Chrome atau Chromium tanpa kepala. Chrome tanpa kepala ialah versi krom yang menjalankan segala-galanya tanpa UI (sesuai untuk menjalankan perkara di latar belakang).

Kami boleh mengautomasikan pelbagai tugas menggunakan dalang, seperti:

• Pengikisan Web: Mengekstrak kandungan daripada tapak web melibatkan interaksi dengan HTML dan JavaScript halaman. Kami biasanya mendapatkan semula kandungan dengan menyasarkan pemilih CSS.
• Penjanaan PDF: Menukar halaman web kepada PDF secara pemrograman adalah sesuai apabila anda mahu menjana PDF secara langsung daripada halaman web, dan bukannya mengambil tangkapan skrin dan kemudian menukar tangkapan skrin kepada PDF. (P.S. Mohon maaf jika anda sudah mempunyai penyelesaian untuk ini).
• Ujian Automatik: Menjalankan ujian pada halaman web dengan mensimulasikan tindakan pengguna seperti mengklik butang, mengisi borang dan mengambil tangkapan skrin. Ini menghapuskan proses yang membosankan untuk melalui borang yang panjang secara manual untuk memastikan segala-galanya tersedia.

?Bagaimana untuk bermula dengan boneka?

Mula-mula kita perlu memasang perpustakaan, teruskan dan lakukan ini.
Menggunakan npm:

npm i puppeteer # Downloads compatible Chrome during installation.
npm i puppeteer-core # Alternatively, install as a library, without downloading Chrome.

Menggunakan benang:

yarn add puppeteer // Downloads compatible Chrome during installation.
yarn add puppeteer-core // Alternatively, install as a library, without downloading Chrome.

Menggunakan pnpm:

pnpm add puppeteer # Downloads compatible Chrome during installation.
pnpm add puppeteer-core # Alternatively, install as a library, without downloading Chrome.

? Contoh untuk menunjukkan penggunaan dalang

Berikut ialah contoh cara mengikis tapak web. (P.S. Saya menggunakan kod ini untuk mendapatkan semula produk daripada tapak web Myntra untuk projek e-dagang saya.)

const puppeteer = require("puppeteer");
const CategorySchema = require("./models/Category");

// Define the scrape function as a named async function
const scrape = async () => {
    // Launch a new browser instance
    const browser = await puppeteer.launch({ headless: false });

    // Open a new page
    const page = await browser.newPage();

    // Navigate to the target URL and wait until the DOM is fully loaded
    await page.goto('https://www.myntra.com/mens-sport-wear?rawQuery=mens%20sport%20wear', { waitUntil: 'domcontentloaded' });

    // Wait for additional time to ensure all content is loaded
    await new Promise((resolve) => setTimeout(resolve, 25000));

    // Extract product details from the page
    const items = await page.evaluate(() => {
        // Select all product elements
        const elements = document.querySelectorAll('.product-base');
        const elementsArray = Array.from(elements);

        // Map each element to an object with the desired properties
        const results = elementsArray.map((element) => {
            const image = element.querySelector(".product-imageSliderContainer img")?.getAttribute("src");
            return {
                image: image ?? null,
                brand: element.querySelector(".product-brand")?.textContent,
                title: element.querySelector(".product-product")?.textContent,
                discountPrice: element.querySelector(".product-price .product-discountedPrice")?.textContent,
                actualPrice: element.querySelector(".product-price .product-strike")?.textContent,
                discountPercentage: element.querySelector(".product-price .product-discountPercentage")?.textContent?.split(' ')[0]?.slice(1, -1),
                total: 20, // Placeholder value, adjust as needed
                available: 10, // Placeholder value, adjust as needed
                ratings: Math.round((Math.random() * 5) * 10) / 10 // Random rating for demonstration
            };
        });

        return results; // Return the list of product details
    });

    // Close the browser
    await browser.close();

    // Prepare the data for saving
    const data = {
        category: "mens-sport-wear",
        subcategory: "Mens",
        list: items
    };

    // Create a new Category document and save it to the database
    // Since we want to store product information in our e-commerce store, we use a schema and save it to the database.
    // If you don't need to save the data, you can omit this step.
    const category = new CategorySchema(data);
    console.log(category);
    await category.save();

    // Return the scraped items
    return items;
};

// Export the scrape function as the default export
module.exports = scrape;

?Penjelasan:

• Dalam kod ini, kami menggunakan Puppeteer untuk mengikis data produk daripada tapak web. Selepas mengekstrak butiran, kami mencipta skema (CategorySchema) untuk menstruktur dan menyimpan data ini ke dalam pangkalan data kami. Langkah ini amat berguna jika kami ingin menyepadukan produk yang dikikis ke dalam kedai e-dagang kami. Jika menyimpan data dalam pangkalan data tidak diperlukan, anda boleh meninggalkan kod berkaitan skema.
• Sebelum mengikis, adalah penting untuk memahami struktur HTML halaman dan mengenal pasti pemilih CSS yang mengandungi kandungan yang ingin anda ekstrak.
• Dalam kes saya, saya menggunakan pemilih CSS berkaitan yang dikenal pasti di tapak web Myntra untuk mengekstrak kandungan yang saya sasarkan.

Atas ialah kandungan terperinci Pengikisan Web Dipermudahkan: Parsing Mana-mana Halaman HTML dengan Puppeteer. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!