Selenium MCP サーバー
鍛冶屋のバッジ
Seleniumを使用してWebDriverインスタンスとやり取りするMCPサーバー。MCP -Server-Starterテンプレートを使用して構築されています。
概要
このサーバーにより、AI エージェントは Selenium WebDriver を介して Web ブラウザー セッションを制御できるようになり、モデル コンテキスト プロトコルを介した Web スクレイピング、自動テスト、フォーム入力などのタスクが可能になります。
コアコンポーネント
- MCP サーバー: Selenium WebDriver アクションを MCP ツールとして公開します。
- Selenium WebDriver : ブラウザと対話します。
- MCP クライアント: 公開されたツールを利用できる AI ホスト (Cursor、Claude Desktop など)。
前提条件
- Node.js (v18以降)
- npm (v7以降)
- WebDriver 実行可能ファイル(ChromeDriver、GeckoDriver など) がシステムの PATH にインストールされ、使用可能になっていること。
- 互換性のある Web ブラウザ(例: Chrome、Firefox)。
はじめる
- リポジトリをクローンします。
git clone <your-repo-url> selenium-mcp-server
cd selenium-mcp-server
- 依存関係をインストールします:
- WebDriver を設定します。
- WebDriver (例:
chromedriver ) がインストールされ、PATH 内にあることを確認します。 - ブラウザ オプションまたは WebDriver パスを指定する必要があるときは
src/seleniumService.ts (このファイルは作成します) を変更します。
- サーバーを構築します。
- サーバーを実行します。あるいは、Cursor や Claude Desktop などの MCP ホストと統合します (以下の統合セクションを参照)。
ツール
このサーバーは次のようなツールを提供します:
selenium_navigate : ブラウザを特定の URL に移動します。selenium_findElement : CSS セレクターを使用してページ上の要素を検索します。selenium_click : 要素をクリックします。selenium_sendKeys : キーストロークを要素に送信します。selenium_getPageSource : 現在のページソース HTML を取得します。- （必要に応じてツールを追加してください）
TypeScript実装
サーバーは@modelcontextprotocol/sdkおよびselenium-webdriverライブラリを使用します。
import { Server } from "@modelcontextprotocol/sdk/server/index.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
import { Builder, By, Key, until, WebDriver } from 'selenium-webdriver';
// Basic server setup (details in src/index.ts)
const server = new Server({
name: "selenium-mcp-server",
version: "0.1.0",
capabilities: {
tools: {}, // Enable tools capability
}
});
// Selenium WebDriver setup (details in src/seleniumService.ts)
let driver: WebDriver;
async function initializeWebDriver() {
driver = await new Builder().forBrowser('chrome').build(); // Or 'firefox', etc.
}
// Example tool implementation (details in src/tools/)
server.registerTool('selenium_navigate', {
description: 'Navigates the browser to a specific URL.',
inputSchema: { /* ... zod schema ... */ },
outputSchema: { /* ... zod schema ... */ },
handler: async (params) => {
await driver.get(params.url);
return { success: true };
}
});
// Connect transport
async function startServer() {
await initializeWebDriver();
const transport = new StdioServerTransport();
await server.connect(transport);
console.log("Selenium MCP Server connected via stdio.");
// Graceful shutdown
process.on('SIGINT', async () => {
console.log("Shutting down WebDriver...");
if (driver) {
await driver.quit();
}
process.exit(0);
});
}
startServer();
発達
- ビルド:
npm run build - 実行:
npm start ( node build/index.jsを実行) - リント:
npm run lint - フォーマット:
npm run format
デバッグ
MCP インスペクターまたは標準の Node.js デバッグ手法を使用します。
MCPホストとの統合
(Cursor、Claude Desktop、Smisery などの元の README から関連セクションを保持し、必要に応じてパスとコマンドを更新します)
カーソル統合
- サーバーを構築する:
npm run build - カーソル内:
Settings > Features > MCP : 新しい MCP サーバーを追加します。 - サーバーを登録する:
- トランスポート タイプとして
stdioを選択します。 - 名前:
Selenium Server (または類似の名前)。 - コマンド:
node /path/to/selenium-mcp-server/build/index.js 。
- 保存。
クロードデスクトップ統合
- サーバーを構築する:
npm run build claude_desktop_config.jsonを変更します。{
"mcpServers": {
"selenium-mcp-server": {
"command": "node",
"args": [
"/path/to/selenium-mcp-server/build/index.js"
]
}
}
}
- Claude Desktop を再起動します。
ベストプラクティス
- 型の安全性と検証には TypeScript と Zod を使用します。
- ツールをモジュール化します (例:
src/tools/内のツールごとに 1 つのファイル)。 - WebDriver エラーを適切に処理します (例: 要素が見つからない、ナビゲーションの問題)。
- WebDriver が適切にシャットダウンされることを確認します (例: サーバー終了時の
driver.quit() )。 - スキーマ、エラー処理、コンテンツ タイプに関する MCP のベスト プラクティスに従います。
もっと詳しく知る
クレジット
Seth Rose が作成したテンプレートに基づいています: