JavaScriptによるウェブスクレイピング：2026年版完全ガイド

を作る JavaScriptでウェブスクレイピング, 、あなたには必要なのは Node.js そして、ターゲット層に合わせたライブラリ。次のものを活用してください Cheerio 静的ページについては、および Puppeteer どこ Playwright コンテンツがクライアント側でレンダリングされ次第。.

このガイドでは、初めてのスクレイパーをインストールし、コーディングし、実行する方法を、段階を追って解説します。.

JavaScriptでウェブスクレイピングを行うための前提条件

JavaScriptでのウェブスクレイピングを行うためのNode.js環境とライブラリ。. — JavaScriptでのウェブスクレイピングを行うためのNode.js環境とライブラリ ©Christina（Alucare.fr向け）

初めてのJSスクリプトを書く前に、始めるには2つの基本的なツールがあれば十分です。.

Node.js : JavaScriptの実行環境 オープンソース かつマルチプラットフォームです。これを使えば、ブラウザの外で、コンソールから直接 JavaScript コードを実行できます。Node.js の公式ドキュメントからダウンロードしてください。.
npm (Node Package Manager) : に組み込まれているパッケージマネージャー Node. これは、たった1つのコマンドでライブラリをインストールするためのものです npm install.

一度 Node.js 設定が完了したら、スクレイピングするウェブページの種類に応じてライブラリを選択します。以下に、よく使われるライブラリを挙げます。.

Cheerio : ～に最適 静的ページのスクレイピング. これは、次のような構文に近い方法で生のHTMLを解析します。 jQuery。彼女はいる 軽量、高速 シンプルですが、ページ内のJavaScriptは実行しません。Cheerioのドキュメントを参照してください。.
Puppeteer と Playwright : 以下の用途に最適です 動的サイト. これらは、本格的なヘッドレスブラウザを制御しており（Chrome どこ Firefox) を行い、実際のユーザーと同じようにページを読み込みます。Puppeteerのドキュメントを参照してください。.

ルールは簡単です： Cheerio 静的ページについては、, Puppeteer どこ Playwright サイトがJavaScriptでデータを読み込んだ直後に。.

JavaScriptでウェブスクレイピングをするには？

仕組みはシンプルだ：まず HTML ウェブページから、関心のある要素を特定し、データを抽出します。ツールの選択は、ただ1つの基準に基づきます。それは、そのページが静的どこ動的 ?

ステップ1：インストールと設定

まずはダウンロードから始めましょう Node.js 公式サイトからダウンロードし、インストールしてください。その後、ターミナルでインストールが正常に行われたか確認してください：

ノード -v
npm -v

両方のバージョンが表示されれば、問題ありません。さあ、プロジェクトを作成しましょう：

mkdir my-scraping
cd my-scraping
npm init -y

このコマンドはファイルを生成します package.json これにより、依存関係が一覧表示されます。あとは、必要に応じて適切なライブラリをインストールするだけです。.

の場合 静的ページ （サーバーから返されたHTMLにすでに含まれているコンテンツ）には、 axios と Cheerio :

npm install axios cheerio

の場合 動的ページ （クライアントサイドのJavaScriptを介して読み込まれるデータ、例えば React, Vue どこ Angular)、その代わりに Puppeteer :

npm puppeteerをインストールする

ステップ2：スクレイピング・スクリプトの作成

JSスクリプトをコーディングする前に、適切なものを特定しましょう CSSセレクタ. 対象のウェブページを Chrome どこ Firefox, 、目的の要素を右クリックし、「インスペクト」を選択します。DOMが表示されます。これにより、タグやクラス（クラス) またはユーザーID (#id) をターゲットとする。.

静的ページのスクレイピングを Cheerio

Cheerio のみを読み込みます プレーンHTML また、JSスクリプトは一切実行されません。クライアントサイドでレンダリングされるサイトでは、ユーザーには空白のページしか表示されません。.

// ライブラリのインポート
const axios = require('axios')；
const cheerio = require('cheerio')；

// 廃止するページのURL
const url = "https://exemple.com"；

// メイン関数
非同期関数 scrapePage() {
  try {
    // HTMLコンテンツをダウンロードする
    const { data } = await axios.get(url)；

    // CheerioでHTMLをロードする
    const $ = cheerio.load(data)；

    // 例：すべてのh1タイトルを取得する
    const titles = []；
    $("h1").each((i,elem) => { を実行します。
      titles.push($(elem).text().trim())；
    });

    // 結果を表示する
    console.log("Titles found:", titles)；

  } catch (error) { // スクレイピング中にエラーが発生しました。
    console.error("スクレイピング中のエラー:", error)；
  }
}

// スクリプトの実行
scrapePage()；

置き換える https://exemple.com 任意のURLを指定し、セレクタを調整してください $("h1") 興味のあるものを絞り込むには： $("p") 段落については、, クラス どこ #id 特定の要素に対して。このメソッドは .text() を返す textContent 要素の、以下のものと同等の jQuery サーバー側。.

動的なページのスクレイピングを Puppeteer

Puppeteer 本物のパイロット ヘッドレスブラウザ そして、JavaScriptによるコンテンツの読み込みが完了するのを待ち、そこで Cheerio 失敗する。.

// Puppeteerのインポート
const puppeteer = require("puppeteer")；

// 廃止するページのURL
const url = "https://exemple.com"；

非同期関数 scrapePage() { // ブラウザを起動します。
  // グラフィカルインターフェイスなしのブラウザを起動する（ヘッドレス）
  const browser = await puppeteer.launch({ headless: true })；
  const page = await browser.newPage()；

  try { // ページに移動します。
    // ページに移動する
    await page.goto(url, { waitUntil: "networkidle2" })；

    // 例：すべてのh1タイトルからテキストを抽出する
    const titles = await page.$$eval("h1", elements =>要素)
      elements.map(el => el.textContent.trim())
    );

    console.log("Titles found:", titles)；

  } catch (error) {
    console.error("Error while scraping:", error)；
  } finally {
    // ブラウザを閉じる
    await browser.close()；
  }
}

// スクリプトを実行する
scrapePage()；

オプション waitUntil: "networkidle2" ～が終わるのを待っている ネットワークリクエスト ウェブページからデータを抽出する前に。.

ステージ3：抽出したデータの管理

データを取得したら、それを JSON データベース用、または シーエスブイ Excelで開くために。このモジュール fs ～の出身である Node.js また、インストールは一切必要ありません。CSVについては、単にライブラリを追加するだけで済みます。 json2csv :

npm install json2csv

const axios = require("axios");
const cheerio = require("cheerio");
const fs = require("fs");
const { Parser } = require("json2csv");

const url = "https://exemple.com";

async function scrapeAndSave() {
  try {
    // Récupérer le HTML de la page
    const { data } = await axios.get(url);
    const $ = cheerio.load(data);

    // Extraire les titres dans un tableau d'objets
    const resultats = [];
    $("h1").each((i, elem) => {
      resultats.push({ titre: $(elem).text().trim() });
    });

    // Sauvegarde en JSON
    fs.writeFileSync("resultats.json", JSON.stringify(resultats, null, 2), "utf-8");
    console.log("Données sauvegardées dans resultats.json");

    // Sauvegarde en CSV
    const parser = new Parser();
    const csv = parser.parse(resultats);
    fs.writeFileSync("resultats.csv", csv, "utf-8");
    console.log("Données sauvegardées dans resultats.csv");

  } catch (error) {
    console.error("Erreur lors du scraping :", error);
  }
}

scrapeAndSave();

このJSスクリプトは、一連の処理を一気に実行します。まずWebページを取得し、HTMLデータを抽出し、その後書き込みを行います。 2つのファイル. ブロック try / catch エラーを処理し、～が タイムアウト または1つ CAPTCHA スクレイピングスクリプト全体が停止してしまうことのないように。.

JavaScriptによるウェブスクレイピングのベストプラクティス

スクリプトを実行する前に、いくつかの簡単な習慣を身につけておけば、JSによるスクレイピングをスムーズに維持できます 効果的、安定している かつ、対象となるサイトの利用規約を遵守していること。また、自分のこの措置は合法である文脈に応じて。.

robots.txtファイルを尊重する : これが鉄則です。ウェブページをスクレイピングする前に、 https://exemple.com/robots.txt. 対象のパスが Disallow, 、スクレイピングはしないでください。そうすれば、倫理的・法的なトラブルを避けることができます。.
クエリの間隔を空ける : サイトにアクセスしすぎないでください。目立たないようにし、ブロックされないよう、各アクセス間に少し間隔を空けてください。.
User-Agentをカスタマイズする : デフォルトでは、JSスクレイパーはすぐに発見されてしまいます。これに対し、 Puppeteer, 以下の方法で現実的なヘッダーを定義する page.setUserAgent() 本物のブラウザを模倣するために。.
エラーやフリーズへの対処 : 呼び出しをブロックで囲む try / catch タイムアウトやCAPTCHAによってスクリプト全体がクラッシュするのを防ぐため。.

どのような代替案を検討すべきか？

ウェブスクレイピングはJavaScriptだけにとどまりません。プロジェクトの内容によっては、他の言語やツールの方がニーズに合っている場合もあります。.

パイソン : 図書館 Scrapy と BeautifulSoup 多くのウェブページからコンテンツを抽出するのに非常に役立ちます。.
PHP : この言語で既にコーディング済みのサイトにスクレイピング機能を直接組み込みたい場合に便利です。.
コーディング不要のツール Bright Data、Octoparse、Apifyなど：これらを使えば、コードを1行も書かずにウェブデータをスクレイピングできます。.

スクレイピングAPIかDIYソリューションか：どちらを選ぶべきか？

本当の課題は言語そのものではなく、自分がどの程度の複雑さまで自分で処理できるかということです。独自のスクレイピングスクリプトを使って Puppeteer どこ Cheerio 設置場所の保護が不十分で、設置量が少ない場合には、依然としてこれが最良の選択肢である。.

あスクレイピングAPI （Bright Dataが提供するようなもの）は、高度なブロック対策――IPアドレスのローテーション、CAPTCHAの自動解決、大規模なJavaScriptレンダリングなど――に直面した時点で、その有用性が高まります。.

要約すると：その DIY お金を節約できるし、たくさんのことを学べる。その’API 大規模なプロジェクトや繰り返し行われるプロジェクトにおいて、時間を節約できます。.

よくある質問

最高のJavaScriptウェブスクレイピングツールは？

それは、スクレイピングしたいウェブページの種類によって異なります。.

Cheerio : 速くて軽量、～に最適 HTMLを解析する 静的ページ。.
Puppeteer : 本格的なブラウザを操作するのに最適 Chrome また、JavaScriptで生成されたコンテンツを管理する。.
Playwright : 近くにある Puppeteer, 、しかし、その マルチブラウザ対応 (Chrome, Firefox, WebKit）およびその他の高度な機能。.