金大哥 - local-scanner-mcp MCP 详情

article

README

🚀 本地扫描 MCP 服务器

本地扫描 MCP 服务器是一个用于扫描本地代码和 localhost URL 的模型上下文协议（MCP）服务器。它提供了一系列工具，可用于验证代码质量、捕获屏幕截图以及分析运行在 localhost 上的网页，为本地开发提供了有力支持。

🚀 快速开始

本地扫描 MCP 服务器扩展了 AI 助手与本地开发环境交互的功能，让 AI 助手能够：

测试和调试正在运行的本地 Web 应用程序。
捕获屏幕截图以进行视觉验证。
检查代码文件的质量并确保符合行业标准。
验证 HTML 文件的可访问性和符合性。

此服务器尤其适合使用 Cline（VSCode 插件）或 Cascade（WindSurf 插件）等 AI 助手的开发人员，可利用 AI 能力辅助本地开发任务。

✨ 主要特性

该服务器提供了以下实用工具：

1. 扫描 localhost

可访问一个 localhost URL，捕获控制台日志，并检查运行时错误。参数： | 参数 | 详情 | | ---- | ---- | | url（必填） | 要扫描的 localhost URL（必须以 http://localhost 或 https://localhost 开头） | | waitTime（可选） | 页面加载后等待的时间，以毫秒为单位（默认：1000） | | actions（可选） | 在页面上执行的操作列表，例如：
- 点击：{ "type": "click", "selector": "#elementId" }
- 输入：{ "type": "input", "selector": "#textInput", "value": "example" } |

示例：

{
  "tool": "scan_localhost",
  "params": {
    "url": "http://localhost:3000",
    "waitTime": 2000,
    "actions": [
      { "type": "click", "selector": "#submitBtn" },
      { "type": "input", "selector": "#searchInput", "value": "测试" }
    ]
  }
}

2. 截取本地网页截图

能够捕获 localhost 上的网页屏幕截图。参数： | 参数 | 详情 | | ---- | ---- | | url（必填） | 要截取的 localhost URL | | width（可选） | 截图的宽度（默认：1920） | | height（可选） | 截图的高度（默认：1080） |

示例：

{
  "tool": "screenshot_localhost",
  "params": {
    "url": "http://localhost:8080",
    "width": 1280,
    "height": 720
  }
}

3. 检查代码质量

可验证 JavaScript/TypeScript 代码的质量。参数： | 参数 | 详情 | | ---- | ---- | | code（必填） | 要检查的代码内容 | | linter（可选） | 使用的代码检查工具（默认：ESLint） |

示例：

{
  "tool": "lint_code",
  "params": {
    "code": "function hello() {\n  console.log('Hello, World!');\n}\nhello();",
    "linter": "ESLint"
  }
}

4. 验证 HTML 文件

用于检查 HTML 文件的可访问性和符合性。参数： | 参数 | 详情 | | ---- | ---- | | html（必填） | 要验证的 HTML 内容 | | checkAccessibility（可选） | 是否检查可访问性（默认：true） | | checkW3C（可选） | 是否检查 W3C 标准符合性（默认：true） |

示例：

{
  "tool": "validate_html",
  "params": {
    "html": "<html><head><title>测试页面</title></head><body><h1>欢迎来到我的网站！</h1></body></html>",
    "checkAccessibility": true,
    "checkW3C": true
  }
}

📦 安装指南

克隆仓库

git clone https://github.com/your-repository/local-scanner-mcp.git
cd local-scanner-mcp

构建项目

npm install

启动服务器

npm start

💻 使用示例

与 VSCode/Cline 集成

编辑 Cline 的配置文件（通常位于 ~/.config/line/addons_config.json）：

{
  "mcpServers": {
    "local-scanner": {
      "command": "node",
      "args": ["$(CURRENT_DIR)/path/to/local-scanner-mcp/build/index.js"],
      "disabled": false,
      "autoApprove": []
    }
  }
}

与 WindSurf/Cascade 集成

编辑 WindSurf 的配置文件（通常位于 ~/.config/windsurf/config.json）：

{
  "mcpServers": {
    "local-scanner": {
      "command": "node",
      "args": ["$(CURRENT_DIR)/path/to/local-scanner-mcp/build/index.js"],
      "disabled": false,
      "autoApprove": []
    }
  }
}

请将 your_username 替换为您的实际用户名。

🔧 技术细节

要添加新工具或增强现有功能，可按以下步骤操作：

在 validateParams 函数中添加对新工具参数的验证。
更新 setupToolHandlers 方法中的工具列表。
实现新工具的处理函数。
更新请求处理器以支持新工具。
构建并测试服务器。

📄 许可证

本项目采用 MIT 许可证。

local-scanner-mcp