DEV Community

Cover image for Webスクレイピング vs ブラウザ拡張機能:データ抽出における使い分け
circobit
circobit

Posted on

Webスクレイピング vs ブラウザ拡張機能:データ抽出における使い分け

Webサイトからデータが必要になった。Pythonスクレイパーを書く?Playwrightを使う?ブラウザ拡張機能を使う?何百ものサイトからデータを抽出してきた経験から、最適なツールを選ぶためのフレームワークをまとめました。

選択肢

アプローチ 実行環境 JS対応 ログイン対応 セットアップ時間
Python + requests サーバー 手動Cookie 5分
Python + BeautifulSoup サーバー 手動Cookie 5分
Playwright/Puppeteer サーバー スクリプト化可能 15分
ブラウザ拡張機能 ユーザーのブラウザ 自動 0分
コピー&ペースト ユーザーのブラウザ 自動 0分

それぞれにトレードオフがあります。一つずつ見ていきましょう。

選択肢1: Python + Requests/BeautifulSoup

最適な用途: 静的HTMLページ、API、自動化パイプライン

import requests
from bs4 import BeautifulSoup

response = requests.get("https://example.com/data")
soup = BeautifulSoup(response.text, "html.parser")

table = soup.find("table")
rows = []
for tr in table.find_all("tr"):
    row = [td.get_text(strip=True) for td in tr.find_all(["td", "th"])]
    rows.append(row)
Enter fullscreen mode Exit fullscreen mode

メリット:

  • 高速実行
  • スケジューリングが容易(cron、Airflow)
  • ブラウザのオーバーヘッドなし

制限事項:

  • JavaScriptを実行しない
  • 最新のサイトはクライアントサイドでテーブルをレンダリングすることが多い
  • 認証には手動のCookie管理が必要

失敗するケース: Reactベースのダッシュボードをスクレイピングしてみてください。取得できるHTMLは空の <div id="root"></div> だけです。

選択肢2: ヘッドレスブラウザ(Playwright/Puppeteer)

最適な用途: JavaScript描画ページ、自動化パイプライン、インタラクションが必要なサイト

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com/dashboard');

  // テーブルのレンダリングを待つ
  await page.waitForSelector('table');

  const data = await page.evaluate(() => {
    const table = document.querySelector('table');
    return Array.from(table.rows).map(row =>
      Array.from(row.cells).map(cell => cell.textContent.trim())
    );
  });

  console.log(data);
  await browser.close();
})();
Enter fullscreen mode Exit fullscreen mode

メリット:

  • JavaScriptを実行する
  • ページとのインタラクションが可能(クリック、スクロール、フォーム入力)
  • 認証フローのスクリプト化が可能

制限事項:

  • 直接HTTPより遅い
  • リソース消費が大きい(メモリ、CPU)
  • エラーハンドリングが複雑
  • ヘッドレスブラウザを検出するサイトがある

失敗するケース: 多くのサイトがnavigatorプロパティ、WebGLフィンガープリント、行動分析でPuppeteer/Playwrightを検出します。ステルスプラグインは役立ちますが万能ではありません。

選択肢3: ブラウザ拡張機能

最適な用途: アドホック抽出、認証済みサイト、ユーザー主導のワークフロー

ブラウザ拡張機能はユーザーの実際のブラウザセッションで実行されるため、以下にフルアクセスできます:

  • 認証済みセッション
  • JavaScriptレンダリングされたコンテンツ
  • ユーザーが見ているそのままのDOM

最適な拡張機能の比較は、テーブルエクスポートに最適なChrome拡張機能 トップ5をご覧ください。

// Chrome拡張機能のコンテンツスクリプト
chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
  if (msg.type === "EXTRACT_TABLE") {
    const table = document.querySelector("table");
    const data = Array.from(table.rows).map(row =>
      Array.from(row.cells).map(cell => cell.textContent.trim())
    );
    sendResponse({ data });
  }
});
Enter fullscreen mode Exit fullscreen mode

メリット:

  • 認証処理不要——すでにログイン済み
  • 見ているものをそのまま取得(JSレンダリング問題なし)
  • どのサイトでも動作(ボット検出なし)
  • サーバーインフラ不要

制限事項:

  • 手動トリガーが必要(ユーザーがクリック)
  • スケジュール実行不可
  • ブラウザコンテキストに限定

失敗するケース: 10,000ページから自動でデータを抽出する必要がある場合。拡張機能はユーザー主導のワークフロー向けであり、バッチ処理向けではありません。

判断フレームワーク

Python + requestsを使うべき場合:

  • ✅ サーバーレンダリングのHTMLページ
  • ✅ 自動化・スケジュール抽出が必要
  • ✅ データパイプラインを構築中
  • ✅ 認証がAPIキーまたは単純なCookieの場合

Playwright/Puppeteerを使うべき場合:

  • ✅ JavaScriptレンダリングが必要なページ
  • ✅ 自動化・スケジュール抽出が必要
  • ✅ インタラクション(スクロール、クリック、ページネーション)が必要
  • ✅ ボット検出対策に対応できる

ブラウザ拡張機能を使うべき場合:

  • ✅ サイトにすでにログイン済み
  • ✅ 時々データが必要(自動化不要)
  • ✅ サイトに強力なボット検出がある
  • ✅ コードを書かずに今すぐデータが欲しい

コピー&ペーストで十分な場合:

  • ✅ 一回限りの抽出
  • ✅ シンプルなテーブル構造
  • ✅ 特定のフォーマットは不要

実例

例1: Wikipediaテーブル

最適なアプローチ: ブラウザ拡張機能またはPython

Wikipediaは認証不要のサーバーレンダリングHTML。Pythonで問題なく動作します:

import pandas as pd

url = "https://en.wikipedia.org/wiki/List_of_countries_by_population"
tables = pd.read_html(url)
df = tables[0]
Enter fullscreen mode Exit fullscreen mode

しかしWikipediaのテーブルは複雑なrowspanやナビゲーション行を含むことがあります。専用の拡張機能はこれらを自動的に処理します。

例2: 金融ダッシュボード(ログイン後)

最適なアプローチ: ブラウザ拡張機能

証券会社がログイン後にポートフォリオデータを表示する場合の選択肢:

  1. Python: 認証フローのリバースエンジニアリング、2FA処理、セッションCookie維持。可能だが脆弱。

  2. Playwright: ログインのスクリプト化、2FAプロンプト処理、データへのナビゲーション。動作するが複雑。

  3. 拡張機能: 通常どおりログインし、「テーブルをエクスポート」をクリック。完了。

時々のエクスポートには、拡張機能がデータ取得までの時間で勝ります。

例3: 日次価格モニタリング(1000ページ)

最適なアプローチ: Playwright + キュー

1000の商品ページで毎日価格をチェックする必要がある場合:

// バッチ抽出の疑似コード
const urls = loadUrlsFromDatabase();

for (const url of urls) {
  const page = await browser.newPage();
  await page.goto(url);
  await page.waitForSelector('.price');

  const price = await page.evaluate(() => 
    document.querySelector('.price').textContent
  );

  await saveToDatabase(url, price);
  await page.close();

  // レート制限
  await sleep(randomBetween(1000, 3000));
}
Enter fullscreen mode Exit fullscreen mode

拡張機能ではこれはできません——ユーザー操作が必要です。Playwrightが適切なツールです。

例4: 一回限りのスポーツ統計エクスポート

最適なアプローチ: ブラウザ拡張機能

FBREFには複雑な2段ヘッダーがあります。今シーズンの統計が一度だけ必要。

Pythonアプローチ: テーブル構造用のカスタムパーサーの作成に30分。

拡張機能アプローチ: エクスポートをクリック。10秒。

一回限りの抽出では、過度なエンジニアリングは不要です。

ハイブリッドアプローチ

両方が必要な場合もあります:

  1. 拡張機能で認証Cookieをエクスポート

    • ログイン済みセッションからCookieをエクスポート
    • Python/Playwrightにインポートして自動化
  2. 拡張機能で構造を調査、Pythonでスケーリング

    • 拡張機能ツールで手動でDOMを調査
    • 構造を理解した上で、ターゲットを絞ったスクレイパーを作成
  3. Playwrightでナビゲーション、拡張機能で抽出

    • スクリプトがページに移動
    • 複雑なテーブル解析に拡張機能APIを呼び出す

私のスタック

Webテーブルデータが必要なケースの80%に:

  • 一回限り、認証あり: HTML Table Exporter(私が開発したブラウザ拡張機能)
  • 一回限り、公開データ: pd.read_html() または拡張機能
  • 自動化パイプライン: カスタムパーサー付きPlaywright
  • API利用可能: 直接API呼び出し(常に推奨)

最適なツールは抽出内容によって異なります。問題の複雑さに合わせてソリューションの複雑さを調整しましょう。


あなたの定番の抽出アプローチは?詳しくは gauchogrid.com/ja/html-table-exporter をご覧いただくか、Chrome Web Store で無料でお試しください。

Top comments (0)