Local Scanner MCP

本地扫描MCP服务器，为AI助手提供本地代码和网页的扫描、验证和截图功能

开发者工具浏览器自动化 #本地扫描 #代码验证 #网页截图 #开发辅助本地 .JavaScript

评分 : 2分

下载量 : 4.7K

更新时间 : 2025-04-28

打开站点

什么是本地扫描器MCP服务器？

本地扫描器MCP服务器是一款帮助开发者与本地开发环境交互的强大工具。它允许AI助手测试、调试和分析运行在本地主机上的Web应用及代码文件。

如何使用本地扫描器MCP服务器？

通过安装服务器并配置客户端（如Cline或Cascade），您可以轻松启动服务并与您的开发项目进行交互。

适用场景

适合需要频繁调试和验证本地项目的开发人员，尤其适用于前端开发、后端服务集成和自动化测试。

主要功能

scan_localhost

访问本地URL，捕获控制台日志并检测运行时错误。

screenshot_localhost

对本地URL生成屏幕截图。

lint_code

检查JavaScript、TypeScript或CSS代码文件的语法和风格。

validate_html

验证HTML内容是否符合标准。

优势

提高开发效率，减少手动操作。

支持多种编程语言和文件格式。

与主流IDE无缝集成。

局限性

仅限于本地环境使用。

可能需要较高的系统资源来运行。

如何使用

下载并安装

克隆GitHub仓库并按照说明安装依赖项。

配置MCP客户端

编辑设置文件以指向服务器路径。

开始使用

调用API执行所需任务，例如截图或代码检查。

使用案例

案例1：扫描localhost

模拟登录过程并捕获错误日志。

案例2：生成截图

获取仪表板页面的完整截图。

案例3：检查代码

检测JavaScript文件中的潜在问题。

案例4：验证HTML

确保HTML文档符合W3C标准。

常见问题

如何安装本地扫描器MCP服务器？

服务器支持哪些编程语言？

为什么我的截图只显示部分内容？

是否可以在Windows上运行该服务器？

🚀 本地扫描 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": []
    }
  }
}