Blog

JavaScriptでレンダリングしてるページをスクレイピングする方法

const puppeteer = require('puppeteer');
const fs = require('fs');

(async () => {
    const browser = await puppeteer.launch({ headless: true });

    let allData = [];

    // ページを1から20まで繰り返し
    for (let i = 1; i <= 20; i++) {
        const page = await browser.newPage();
        await page.goto(`https://xxxxxxxxxx/?page=${i}`);

        // ページが完全にロードされるまで待つ
        await page.waitForSelector('.entry');

        // entry2ごとにnameとtableの最初のtrのtdのテキストを取得
        const data = await page.$$eval('.entry', entries => {
            return entries.map(entry => {
                const nameText = entry.querySelector('.name')?.textContent.trim() || '';
                const tableCells = Array.from(entry.querySelectorAll('.address'));
                const tableText = tableCells.map(cell => cell.textContent.trim()).join(',');
                return nameText + ',' + tableText;
            });
        });

        allData = allData.concat(data);

        await page.close();
    }

    // データをCSV形式に変換
    const csvData = allData.join('\n');  // Already formatted for CSV

    // CSVファイルに保存
    fs.writeFileSync('output.csv', csvData);

    console.log("Data saved to outputs.csv");

    await browser.close();
})();

Node.jsを使うのでnpmから「ヘッドレスChrome」が使えるpuppeteerをインストールしておきます。

npm i puppeteer

そして上のコード(scrape.js)を実行することでoutputs.csvファイルにスクレイピング結果を出力することができます。