Chrome Tools MCP Server

🚀 Chrome工具MCP服務器

Chrome工具MCP服務器藉助Chrome的DevTools協議，提供了一系列用於遠程控制Chrome標籤頁的工具。該服務器具備在標籤頁中執行JavaScript、捕獲截圖、監控網絡流量等實用功能。

🚀 快速開始

當你需要手動配置瀏覽器處於某種狀態，再讓Cline等AI工具進行操作時，這種類型的MCP服務器非常有用。此外，你還可以利用此工具監聽並提取網絡事件到其上下文中。

✨ 主要特性

• 列出Chrome標籤頁
• 在標籤頁中執行JavaScript
• 捕獲截圖
• 監控網絡流量
• 將標籤頁導航至URL
• 查詢DOM元素
• 點擊元素並捕獲控制檯輸出

📦 安裝指南

安裝依賴

npm install @nicholmikey/chrome-tools

配置環境變量

通過MCP設置中的環境變量進行配置：

{
  "chrome-tools": {
    "command": "node",
    "args": ["path/to/chrome-tools/dist/index.js"],
    "env": {
      "CHROME_DEBUG_URL": "http://localhost:9222",
      "CHROME_CONNECTION_TYPE": "direct",
      "CHROME_PROXY_ENABLED": true
    }
  }
}

設置步驟

1. 安裝Node.js和npm

確保已安裝Node.js和npm：

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh | bash
nvm install --lts

2. 安裝chrome-tools

在項目目錄中運行：

npm install @nicholmikey/chrome-tools

3. 啟動MCP服務器

創建並運行以下配置文件：

const { MCP } = require('@nicholmikey/mcp');
const server = new MCP.Server({
  port: 3000,
  workers: 2
});

server.start();

📚 詳細文檔

list_tabs

列出所有Chrome標籤頁。

返回值

• 數組，包含每個標籤頁的詳細信息：
  • id: 標籤頁唯一標識符
  • title: 標題
  • url: 當前URL
  • status: 狀態（正在加載、已停止等）

execute_script

在指定標籤頁中執行JavaScript代碼。

參數

• tabId: 標籤頁唯一標識符
• script: 要執行的JavaScript代碼

返回值

• 執行結果：
  • success: 是否成功（布爾值）
  • result: 執行返回的結果

captureScreenshot

捕獲指定標籤頁的截圖。

參數

• tabId: 標籤頁唯一標識符
• path: 截圖保存路徑

返回值

• 圖片文件路徑或錯誤信息

captureNetworkEvents

監控並捕獲指定標籤頁中的網絡事件。

參數

• tabId: 標籤頁唯一標識符
• duration: 捕捉時長（秒）
• filters: 可選的類型和URL模式過濾器

返回值

• 網絡事件日誌數組，包含每個事件的詳細信息：
  • type: 事件類型
  • url: 請求或響應的URL
  • timeStamp: 時間戳
  • size: 數據大小

load_url

將指定標籤頁導航至新的URL。

參數

• tabId: 標籤頁唯一標識符
• url: 要加載的目標URL

query_dom_elements

通過CSS選擇器查詢並獲取DOM元素的詳細信息。

參數

• tabId: 標籤頁唯一標識符
• selector: CSS選擇器字符串

返回值

• 元素數組，每個元素包含：
  • nodeId: 節點唯一標識符
  • tagName: HTML標籤名
  • textContent: 文本內容
  • attributes: 屬性對象
  • boundingBox: 佈局位置和尺寸
  • isVisible: 是否可見
  • ariaAttributes: ARIA屬性

click_element

通過CSS選擇器定位元素並執行點擊操作，同時捕獲控制檯輸出。

參數

• tabId: 標籤頁唯一標識符
• selector: CSS選擇器字符串

返回值

• 操作結果：
  • message: 成功或失敗消息
  • consoleOutput: 點擊觸發的控制檯輸出數組

📄 許可證

本項目採用MIT許可證。