Web スクレイピングが簡単に: Puppeteer であらゆる HTML ページを解析

eBay、Amazon、Flipkart などの大手ストアからリアルタイムで商品データを簡単に取得できる e コマース プラットフォームを構築することを想像してください。確かに、Shopify や同様のサービスはありますが、正直に言うと、プロジェクトのためだけにサブスクリプションを購入するのは少し面倒に感じるかもしれません。そこで、これらのサイトをスクレイピングして製品をデータベースに直接保存してはどうだろうかと考えました。これは、当社の電子商取引プロジェクト用の製品を入手するための効率的かつコスト効率の高い方法となるでしょう。

Webスクレイピングとは何ですか?

Web スクレイピングには、Web ページの HTML を解析してコンテンツを読み取って収集することにより、Web サイトからデータを抽出することが含まれます。多くの場合、ブラウザの自動化やサイトへの HTTP リクエストの送信、その後 HTML 構造の分析を行って、テキスト、リンク、画像などの特定の情報を取得します。Puppeteer は、Web サイトをスクレイピングするために使用されるライブラリの 1 つです。

?パペッティアとは？

Puppeteer は Node.js ライブラリです。ヘッドレス Chrome または Chromium ブラウザを制御するための高レベル API を提供します。ヘッドレス Chrome は、UI なしですべてを実行する Chrome のバージョンです (バックグラウンドで実行するのに最適です)。

puppeteer を使用すると、次のようなさまざまなタスクを自動化できます。

• Web スクレイピング: Web サイトからコンテンツを抽出するには、ページの HTML と JavaScript を操作する必要があります。通常、CSS セレクターをターゲットにしてコンテンツを取得します。
• PDF 生成: プログラムによる Web ページの PDF への変換は、スクリーンショットを撮ってからそのスクリーンショットを PDF に変換するのではなく、Web ページから PDF を直接生成する場合に最適です。 (追記: すでに回避策がある場合は申し訳ありません)。
• 自動テスト: ボタンをクリックする、フォームに記入する、スクリーンショットを撮るなどのユーザーアクションをシミュレートすることにより、Web ページ上でテストを実行します。これにより、すべてが適切に配置されていることを確認するために長いフォームを手動で実行するという面倒なプロセスが不要になります。

?Puppetter を始めるにはどうすればよいですか?

まず、ライブラリをインストールする必要があります。先に進んでこれを行ってください。
npm の使用:

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

使用糸:

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

pnpm の使用:

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

? puppeteer の使用例を示す例

これは、Web サイトをスクレイピングする方法の例です。 (追記: このコードを使用して、電子商取引プロジェクトの Myntra Web サイトから商品を取得しました。)

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;

?説明:

• このコードでは、Puppeteer を使用して Web サイトから製品データを収集しています。詳細を抽出した後、スキーマ (CategorySchema) を作成してこのデータを構造化し、データベースに保存します。このステップは、スクレイピングした製品を e コマース ストアに統合する場合に特に役立ちます。データをデータベースに保存する必要がない場合は、スキーマ関連のコードを省略できます。
• スクレイピングの前に、ページの HTML 構造を理解し、抽出するコンテンツがどの CSS セレクターに含まれているかを特定することが重要です。
• 私の場合、Myntra Web サイトで特定された関連する CSS セレクターを使用して、対象とするコンテンツを抽出しました。

以上がWeb スクレイピングが簡単に: Puppeteer であらゆる HTML ページを解析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。