JavaScriptは、ブラウザ操作や動的ページのデータ取得に適した言語です。本記事では、Node.jsとPuppeteerを使ったWebスクレイピングの方法を詳しく解説します。必要な開発環境からサンプルコード、エラーの対処法までを網羅しています。
1. Webスクレイピングとは?
Webスクレイピングとは、ウェブサイトからデータを自動的に取得する技術です。ニュースサイトの記事一覧や商品の価格データを収集するといった用途に利用されます。大量のデータを自動で集めたい時に非常に便利ですね。
2. JavaScriptでWebスクレイピングを行うメリット
Pythonをはじめ色々な言語でウェブスクレイピングができますが、JavaScriptでももちろんできます。JavaScriptを使うメリットは以下の通りです。
- ブラウザ環境で動作
動的に生成されるページにも対応可能。 - 学習コストが低い
フロントエンド経験者にとって馴染みやすい。 - 豊富なライブラリ
PuppeteerやAxiosなど、強力なツールが揃っています。
3. 必要な開発環境
以下の開発環境を用意します。
- Node.js
JavaScriptをサーバーサイドで実行するためのランタイム。- Node.js公式サイトから最新のLTS版をインストール。
- Puppeteer
ブラウザを操作するためのライブラリ。- 以下のコマンドでインストール:
npm install puppeteer
- 以下のコマンドでインストール:
- コードエディタ
Visual Studio Code(VS Code)など。
4. Puppeteerを使ったスクレイピングの基本
Puppeteerを使うことで、Google Chromeを操作してデータを収集できます。具体的には、以下の操作が可能です。
- ウェブページの自動操作
- 動的に生成されるデータの取得
- PDFやスクリーンショットの生成
5. サンプルコード:ウェブページのタイトルを取得
以下は、指定したウェブサイトのタイトルを取得するサンプルコードです。以下のコード例では「https://www.yahoo.co.jp/」のタイトルを取得します。
コード例
const puppeteer = require('puppeteer');
(async () => {
// ブラウザを起動
const browser = await puppeteer.launch();
const page = await browser.newPage();
// ページにアクセス
await page.goto('https://www.yahoo.co.jp/');
// ページのタイトルを取得
const title = await page.title();
console.log('ページタイトル:', title);
// ブラウザを閉じる
await browser.close();
})();
出力結果:

実行方法
- 上記コードを
scraper.js
という名前で保存。 - ターミナルで以下を実行:
node scraper.js
実行すると、ページタイトルがコンソールに表示されます。
6. よくあるエラーと対処法
エラー1: Could not find Chrome
原因: Puppeteerが使用するChromeが見つからない。
対処方法: 以下のコマンドでChromeをインストール。
npx puppeteer install
エラー2: SyntaxError: Unexpected token '??='
原因: Node.jsのバージョンが古い。
対処方法: Node.jsを最新バージョンに更新。以下を実行。
nvm install node
エラー3: EACCES: permission denied
原因: パーミッションの問題でキャッシュディレクトリが使用できない。
対処方法: キャッシュディレクトリを手動で設定。
export PUPPETEER_CACHE_DIR=~/.cache/puppeteer
エラー4: タイムアウト
原因: ページ読み込みが遅い。
対処方法: タイムアウト時間を延長。
await page.goto('https://example.com', { timeout: 60000 });
7. まとめ
JavaScriptとPuppeteerを使えば、Webスクレイピングを効率的に実現できます。本記事で紹介した方法を活用して、ご自身のプロジェクトに役立ててください。さらに詳しい使い方はhttps://2jigenha.com/how-to-use-puppeteer/を参照してください!