この記事では
- Playwright MCPサーバーとは何か、ウェブスクレイピングにどのように使用できるか。
- Playwright MCPサーバーで利用できる様々なツール
- Bright Data Web MCPサーバーがどのようにウェブスクレイピングのためのシンプルな代替手段を提供できるか。
さっそく見ていきましょう！
Playwright MCPサーバー
Playwrightはブラウザ自動化ツールとして広く知られており、ブラウザのテストやタスクの自動化によく使用されています。Playwright MCPサーバーはこの機能をベースにしているが、今回は人間が直接使用するためではなく、AIエージェントのために設計されている。
サーバーを実行することで、任意のMCPホストに接続し、AIエージェントにPlaywrightの完全な自動化ツールキットへのアクセスを許可することができる。
つまり、AIエージェントは人間と同じようにウェブブラウザと対話し、オンライン購入、最新ニュースの取得、電子メールへの返信などのアクションを実行することができる。
この記事では、ウェブスクレイピングに焦点を当てます。Playwright MCPサーバーを使用すると、ブラウザの自動化だけでなく、LLMがウェブから直接データをスクレイピングして抽出するために必要な低レベルのツールを手に入れることができる。
Playwright MCPサーバー
すべてのMCPサーバーと同様に、Playwright MCPサーバーにはAIエージェントに公開できるツールセットが付属している。これらのツールは、開発者がすでに知っていて使用しているPlaywright APIに直接マッピングされている。最も重要なものをいくつか見てみよう：
- Browser_click：人間がマウスを使うように、AIエージェントが要素をクリックできるようにします。
- Browser_drag：ドラッグ＆ドロップのインタラクションを可能にする。
- Browser_close: ブラウザを閉じます：ブラウザのインスタンスを閉じます。
- Browser_evaluate：AIエージェントに、ページ内でJavaScriptコードを直接実行させます。
- Browser_file_upload：ブラウザを通してファイルのアップロードを処理します。
- ブラウザフィルフォーム（Browser_fill_form）：ウェブページ上のフォームに入力します。
- Browser_hover：要素の上にマウスポインタを移動します。
- Browser_navigate：ナビゲーション：任意のURLに移動します。
- Browser_press_key：キー入力をシミュレートし、エージェントがキーボード入力に完全にアクセスできるようにします。
AIエージェントが自由に使えるこれら全てのツールで、ウェブを簡単に操作し、データをスクレイピングすることができる。それでは、その方法を見てみよう。
Playwright MCPサーバによるウェブスクレイピング
このセクションでは、Playwright MCPサーバーを使用してWebスクレイピングタスクを実行する。私たちのAIエージェントは、iPhone 16モデルの最新の価格情報を収集します。物事をシンプルにするために、タスクは1つのソースに限定します：Best Buyです。
サーバーの設定
Playwright MCPサーバーを実行するには、MCPホストが必要である。Claude Desktop、Cursor、Gemini CLIなど、好きなホストを使用することができる。この記事では、VS Codeを使用する。
Playwright MCPサーバーはNode.jsで実装されたローカルMCPサーバーなので、先に進む前にNodeがインストールされていることを確認してください。
サーバをセットアップするには、MCPホストに以下の設定を追加する必要がある：
{
"servers"：{
"playwright"：{
"コマンド"："npx"、
"args": [
"@playwright/mcp@latest"
]
}
}
}この設定は、他のMCPホストでは多少異なるかもしれませんが、VS CodeでのMCPサーバーのセットアップ方法に適用されます。セットアップが完了すると、AIエージェントはサーバーが提供するツールにアクセスできるようになる。これで、スクレイピングを開始できる。
MCPサーバーでのスクレイピング
最初のステップは、BestBuyのウェブサイトに移動することだ。これを行うには、AIエージェントにサイトを開くように指示するだけで、Browser_navigateツールを使ってサイトを開きます。
次に、AIエージェントにiPhone 16を検索するように指示します。そのためには、Browser_press_keyツールを使って検索クエリを入力します。
そして、AIエージェントはBrowser_clickツールを使って検索ボタンをクリックする。
これで検索結果が得られる。エージェントがページをナビゲートする各ステップで、現在の状態のスナップショットをキャプチャする。そして、これらのスナップショットを使って、必要な情報を抽出し、構造化されたフォーマットに整理するようにエージェントに指示することができます。
このアプローチで、サイトのスクレイピングに成功した。しかし、これでほとんど何でもできるようになったとはいえ、まだかなり低レベルです。データをスクレイピングすることだけが目的であれば、より広範なウェブ自動化機能は必要ないかもしれないので、これは過剰に感じるかもしれない。
次に、Bright Data Web MCP サーバーが同じタスクをどのように実現できるかを、より高いレベルの視点から探ってみましょう。
Bright Data Web MCPサーバー：ハイレベルなウェブスクレイピングMCPサーバー
Bright Web Data MCPサーバーには、Webスクレイピングのために特別に構築された高レベルのツールが付属しています。Amazonのようなプラットフォームからデータを抽出したり、個人や企業のプロフィールを取得したり、Instagramのプロフィール、投稿、リールを収集するためのツールも含まれています。
低レベルで動作するPlaywright MCPとは異なり、Bright Data Web MCPサーバーは、AIエージェントのスクレイピングプロセスを簡素化します。ボット検出やCAPTCHAで保護されたウェブページも処理できるため、従来の方法では失敗する可能性のあるところでも、エージェントは確実にアクセスすることができます。
このウォークスルーでは、Bright Data Web MCPサーバーを使用して、Playwright MCPで以前に取り組んだのと同じタスクを実行します。このサーバーには、2つのコアツールが用意されています：
- 検索エンジンツール
- マークダウンとしてデータをスクレイプするツール
Pro Modeを有効にすることで、さらに多くのツールをアンロックすることができるが、今はこの2つだけにしておこう。詳細はこちらの記事を参照されたい。
サーバーの設定
ローカルで動作するPlaywright MCPサーバーとは異なり、Bright Data Web MCPサーバーはリモートのMCPサーバーです。つまり、設定プロセスが若干異なります。以下はVS Codeでの設定方法です：
"BrightData"：{
"url"："https://mcp.brightdata.com/mcp?token=YOUR_API_KEY"、
}接続するには、Bright Data APIキーが必要です。設定完了後、エージェントはスクレイピングを開始できます。
MCP サーバーでのスクレイピング
まず、iPhone 16の価格をウェブ検索するようにエージェントに指示します。
エージェントは、サーバの検索エンジンツールを使用してリクエストを実行します。
結果を取得した後、エージェントに任意のサイト（この場合はApple Store）から情報を抽出するように指示します。エージェントは、マークダウンツールとしてスクレイプデータを使用してコンテンツを取り出し、エージェントが簡単に処理し理解できるマークダウン形式で返します。
抽出された情報を使って、構造化されたフォーマットに整理するようエージェントに指示することができます。
この例では、スクレイピングタスクを完了するために2つのツールだけを使用しました。しかし、Bright Data Web MCP サーバーは、より高度なユースケースのために探索することができるプロモードでの追加ツールも提供しています。この詳細な記事でさらに例を見ることができます。
まとめ
この記事では、AIエージェントの助けを借りてウェブをスクレイピングするためにMCPサーバーをどのように使用できるかを探りました。まず、Playwright MCPサーバーを取り上げました。このサーバーは、ブラウザオートメーションへの低レベルアクセスを提供し、エージェントが全てのインタラクションを完全にコントロールできるようにします。これは、より高いレベルで動作し、ボット検出によって保護されたサイトであっても、ウェブスクレイピングのために特別に設計された特別なツールをエージェントに提供します。
どちらのアプローチにも長所があり、Playwrightはきめ細かいブラウザコントロールが必要な場合に理想的であり、Bright Dataはプロセスを簡素化し、必要な情報を抽出することだけに集中することができます。
次は、両方のMCPサーバーを試してみて、どちらが次のプロジェクトに最適かを決める番です。
