puppeteer

Puppeteerの使い方完全マニュアル【スクレイピング・自動化・応用例】

PuppeteerはGoogleが開発したNode.js用ライブラリで、ChromeやChromiumブラウザを操作できます。ウェブスクレイピングやE2Eテスト、タスクの自動化など、幅広い用途で活用されています。本記事では、基本的なセットアップ方法から、実践的なコード例、さらに応用例やエラー解決方法まで解説します!


1. Puppeteerとは?概要と特徴

PuppeteerはNode.jsを使ってChromeブラウザを操作できるオープンソースライブラリです。以下がPuppeteerの主な特徴です。

特徴

  • 動的ページに対応: ReactやVue.jsで構築されたシングルページアプリケーション(SPA)のデータも取得可能。
  • ブラウザ自動化: ページ操作、スクロール、クリック、フォーム入力などを簡単に自動化。
  • データ収集: 通常のHTTPリクエストでは取得できないコンテンツ(例: JavaScriptで生成される内容)を収集。
  • ファイル生成: PDFやスクリーンショットを簡単に作成。

2. Puppeteerのインストールとセットアップ

必要な環境

  • Node.js: 最新のLTSバージョン(推奨)をインストール。
  • npm: Node.jsに付属しているパッケージ管理ツール。

インストール手順

  1. Node.jsをインストール
    Node.js公式サイトからダウンロードしてインストールします。
  2. Puppeteerをインストール
    ターミナルで以下のコマンドを実行してください: npm install puppeteer
  3. Puppeteerの動作確認
    以下のスクリプトを実行して、インストールが正しく行われたか確認します: const puppeteer = require('puppeteer'); console.log('Puppeteer is ready!');

3. Puppeteerの基本的な使い方

Puppeteerを使用する際に覚えておきたい基本操作を紹介します。

ブラウザの起動

const browser = await puppeteer.launch();

ページの生成

const page = await browser.newPage();

指定URLにアクセス

await page.goto('https://example.com');

データの取得

JavaScriptで動的に生成されるコンテンツも取得可能:

const data = await page.evaluate(() => document.querySelector('h1').innerText);
console.log(data);

スクリーンショットの撮影

await page.screenshot({ path: 'screenshot.png', fullPage: true });

PDFの生成

await page.pdf({ path: 'output.pdf', format: 'A4' });

4. 実践的なスクレイピング例

例1: ページタイトルの取得

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  
  const title = await page.title();
  console.log('ページタイトル:', title);

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

例2: 特定の要素の取得

指定したCSSセレクタの内容を取得します。

const content = await page.evaluate(() => document.querySelector('.target-class').innerText);

例3: リストデータの収集

複数の要素を取得し、配列で返します。

const items = await page.evaluate(() => {
  return Array.from(document.querySelectorAll('.list-item')).map(item => item.textContent);
});
console.log(items);

5. 応用例:Puppeteerを使った高度なブラウザ操作

1. フォームの自動入力と送信

await page.type('#username', 'testuser');
await page.type('#password', 'password123');
await page.click('#submit-button');

2. JavaScriptコードの実行

ページ内で任意のJavaScriptコードを実行できます。

await page.evaluate(() => {
  document.body.style.backgroundColor = 'blue';
});

3. ページのリクエストをインターセプト

page.on('request', request => {
  if (request.resourceType() === 'image') {
    request.abort(); // 画像リソースをブロック
  } else {
    request.continue();
  }
});

6. Puppeteerを利用する際の注意点

  1. 利用規約の遵守: スクレイピング対象サイトの利用規約を必ず確認。
  2. リクエスト間隔の設定: サーバーへの負荷を避けるために適切な間隔を設ける。
  3. リソースの管理: ブラウザの終了処理を忘れない(await browser.close())。

7. よくあるエラーとその対処法

エラー1: Could not find Chrome

原因: Puppeteerが使用するChromeが見つからない。
対処法:

npx puppeteer install

エラー2: TimeoutError

原因: ページの読み込みが遅い。
対処法:

await page.goto('https://example.com', { timeout: 60000 });

エラー3: SyntaxError: Unexpected token ‘??=’

原因: Node.jsのバージョンが古い。
対処法:

nvm install node

8. Puppeteerと他のライブラリの比較

ライブラリ特徴適用例
PuppeteerChrome操作、自動化に特化動的ページのスクレイピング
Playwright複数ブラウザ対応(Firefox, WebKitなど)クロスブラウザテスト
CheerioHTMLの解析に特化(ブラウザなし)静的ページのスクレイピング

9. まとめ

Puppeteerは、ブラウザを自動化し、スクレイピングやテストに活用するための非常に強力なツールです。本記事で紹介した基本操作から応用例までを参考に、あなたのプロジェクトに役立ててください。また、エラーが発生した場合は本記事のトラブルシューティングを活用してください

上部へスクロール