• データ
  • 入力
  • 確認
  • ログ

AIで動的なウェブデータをスクレイピングする方法：Hyperbrowser MCPを活用

HyperbrowserをAIクライアントに接続すれば、JavaScriptの実行が必要なサイトも扱えます。AIエージェントがブラウザを操作し、必要なデータを正確に取得します。

このページについてAIに聞く

すぐに答え

AIでJavaScriptを多用するサイトをスクレイピングするには？

Hyperbrowserを使用してヘッドレスブラウザを起動し、JavaScriptを実行してコンテンツの読み込みを待機してから、特定の要素を抽出します。生のHTMLではなく、構造化されたJSONとしてデータを受け取れるため、従来のスクレイパーでは読み取れなかったモダンなウェブアプリからもデータを抽出可能です。

出力結果

データがどのように変換されるか

スクレイピングが完了すると、AIは業務に必要なすべての情報を手に入れます。

データ

構造化されたJSONオブジェクト

複雑なDOM要素を、整理された予測可能なJSONに変換します。そのまま他のツールやスプレッドシートに流し込めます。

入力

クリーンなテキストコンテンツ

エージェントはスクリプトやスタイルを除去し、分析に必要なテキストのみを抽出します。

確認

手動での確認が必要な場合

サイトに高度なアンチボット対策やCAPTCHAが導入されている場合、エージェントが回避できず、手動での確認が必要になることがあります。

ログ

セッション履歴

ブラウザの操作記録が残るため、エージェントがどのようにサイトをナビゲートしたかを正確に把握できます。

ワークフロー

リクエスト受信時のAIの動作

AIがHyperbrowserを通じてブラウザのライフサイクル全体を管理します。

  1. ブラウザの起動

    対象のURLを処理するために、エージェントが独立した新しいブラウザ環境を立ち上げます。

    create_session

  2. スクレイピングの実行

    エージェントがナビゲーションを開始し、JavaScriptによってページコンテンツが描画されるのを待ちます。

    start_scrape

  3. 進捗の監視

    バックグラウンドタスクの状態を確認し、ページが正しく読み込まれたかをチェックします。

    get_scrape_job

  4. 結果の解析

    指定された特定のデータポイントを抽出し、構造化された形式にまとめます。

    extract_data

試してみる

以下のプロンプトをコピーして開始

これらのプロンプトを使ってスクレイピングを開始できます。

出発点

これらは例です。用途に合わせてURLや抽出したいデータ項目を書き換えてください。

Hyperbrowser Connector

準備完了です。MCPクライアントを選択し、セットアップ手順に従ってください。

コネクタリンクhttps://edge.vinkius.com/vk_preview_EqoI5YUdTojrkVnHi3vlv78c8o8EuUlEun2fY5jf/mcp

Claude Desktop

以下の手順で数秒で接続できます。

  1. 1In Claude Desktop, open Settings → Connectors.
  2. 2Click “Add custom connector” and paste the connector link above as the remote MCP server URL.
  3. 3Click Add and start a new chat — Hyperbrowser capabilities are ready to use.
設定 · claude_desktop_config.jsonコピー
{
  "mcpServers": {
    "hyperbrowser-web-infra-for-ai-mcp": {
      "url": "https://edge.vinkius.com/vk_preview_EqoI5YUdTojrkVnHi3vlv78c8o8EuUlEun2fY5jf/mcp"
    }
  }
}
チャットにコピー04

  • https://example.com/shop から現在の製品価格をスクレイピングし、JSONリストで出力してください。

  • LinkedInの検索ページにアクセスし、最初の5件の結果から名前と役職を抽出してください。

  • https://app.example.com のダッシュボードに移動し、最新の取引履歴を取得してください。

  • CNNのホームページから最新のニュース見出しを見つけ、JSON配列の形式でまとめてください。

  • Claude
  • ChatGPT
  • Cursor
  • VS Code
  • Windsurf
  • Claude Code
  • JetBrains
  • Cline

ここから始める

Hyperbrowserを一度接続すれば、あとは指示するだけ

アカウントの連携は一度だけで完了します。認証情報は暗号化されて保護されるため、すぐにAIにウェブブラウジングを依頼できます。

HyperbrowserをAIに接続する

FAQ

スクレイピングの仕組みについて

  • 01

    AIはウェブサイト上のボタンをクリックできますか？

    はい。ボタンのクリックや、コンテンツを読み込むためのスクロールが必要なサイトでも、エージェントは操作可能です。

  • 02

    AIがウェブサイトの内容を書き換えることはありますか？

    いいえ。エージェントはデータの読み取りと抽出のみを行います。フォームの送信、アカウントの削除、サイト設定の変更などはできません。

  • 03

    JavaScriptを多用するサイトでも動作しますか？

    はい。それがこのコネクターの主な目的です。従来のスクレイパーでは読み込めなかったサイトにも対応しています。

  • 04

    AIはCAPTCHAを回避できますか？

    いいえ。人間による操作を必要とするCAPTCHAが表示された場合、エージェントはブロックされます。

  • 05

    抽出したデータを直接データベースに保存できますか？

    エージェントはデータをJSON形式で抽出します。そのJSONをデータベースに保存するには、別のツールや自作のスクリプトを使用する必要があります。

  • Hyperbrowserについて他に質問がありますか？ Hyperbrowser MCPの全機能を確認する

『Hyperbrowser』を Claude、Cursor、ChatGPT などに接続