Browser MCP

🚀 瀏覽器 MCP

瀏覽器 MCP 是一套包含瀏覽器擴展和 MCP 服務器的工具，它允許用戶與當前使用的瀏覽器進行交互，為用戶提供了便捷的瀏覽器操作體驗。

🚀 快速開始

配置示例

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@djyde/mcp-browser@latest"
      ]
    }
  }
}

✨ 主要特性

工具列表

所有可用工具在 server/src/tools.ts 中列出，以下是部分工具介紹：

• get_current_page_markdown：獲取當前瀏覽器頁面的Markdown內容。
  • 示例：

總結當前頁面。

• append_style：向當前瀏覽器頁面追加CSS樣式。
  • 示例：

將當前頁面設置為暗黑模式。

• history_search：搜索瀏覽器歷史記錄。
  • 示例：

在瀏覽歷史中搜索“github”。

📦 安裝指南

依賴安裝

pnpm i

擴展構建

cd extension

# 對Chrome瀏覽器構建
npm run build

# 對Edge瀏覽器構建
npm run build:edge

# 對Firefox瀏覽器構建
npm run build:firefox

構建完成後，擴展文件位於 extension/.output 目錄。

服務器端構建

cd server

# 開發模式啟動
npm run dev

# 構建服務器
npm run build

server/dist/cli.js 是MCP服務器的入口文件。

📚 詳細文檔

未來規劃

• [ ] 將擴展發佈到應用商店。
• [ ] 編寫文檔。
• [ ] 添加更多工具。

貢獻指南

添加新工具

1. 將工具模式添加到 tools.ts 文件中的 tools 數組。
2. 在 extension/calls.ts 中實現可擴展調用處理函數。
3. 在 server/src/tools.ts 中為工具添加處理器。使用 call 函數調用擴展端的處理程序。

📄 許可證

本項目採用 AGPL-3.0 或更高版本的授權協議。