MCP 可访问性扫描仪🔍
一个模型上下文协议 (MCP) 服务器，使用 Playwright 和 Axe-core 提供自动化的 Web 无障碍扫描。该服务器使 LLM 能够执行 WCAG 合规性检查、捕获带注释的屏幕截图并生成详细的无障碍报告。
特征
✅ 全面检查 WCAG 2.1/2.2 合规性
🖼️ 自动截图并突出显示违规内容
📄 带有补救指南的详细 JSON 报告
Related MCP server: Cursor A11y MCP
安装
您可以使用以下任一方法安装该软件包：
使用 npm：
npm install -g mcp-accessibility-scanner
Docker 安装
该项目包括一个 Dockerfile，其中设置了所有必要的依赖项，包括 Node.js v22 和 Python 3.13。
构建 Docker 镜像：
docker build -t mcp-server .
运行容器：
docker run -it -e MCP_PROXY_DEBUG=true mcp-server
您也可以在后台运行它：
docker run -d -p 3000:3000 mcp-server
在 VS Code 中安装
使用 VS Code CLI 在 VS Code 中安装辅助功能扫描器：
对于 VS Code：
code --add-mcp '{"name":"accessibility-scanner","command":"npx","args":["mcp-accessibility-scanner"]}'
对于 VS Code 内部人员：
code-insiders --add-mcp '{"name":"accessibility-scanner","command":"npx","args":["mcp-accessibility-scanner"]}'
配置
以下是 Claude 桌面配置：
{
"mcpServers": {
"accessibility-scanner": {
"command": "npx",
"args": ["-y", "mcp-accessibility-scanner"]
}
}
}
用法
扫描仪公开一个单一工具scan_accessibility ，它接受：
注意：运行扫描时，突出显示任何可访问性违规的带注释的屏幕截图将自动保存到您的下载文件夹中。
Claude 中的用法示例：
Could you scan example.com for accessibility issues related to color contrast?
具有自定义选项的高级示例：
Could you scan example.com for accessibility issues with a viewport of 1280x720 and show the browser window?
发展
克隆并设置项目：
git clone https://github.com/JustasMonkev/mcp-accessibility-scanner.git
cd mcp-accessibility-scanner
npm install
以监视模式启动 TypeScript 编译器：
在本地测试 MCP 服务器：
Docker 开发
对于使用 Docker 进行开发：
构建开发镜像：
docker build -t mcp-server-dev .
使用卷安装运行以进行实时代码更改：
docker run -it -v $(pwd):/app -p 3000:3000 -e MCP_PROXY_DEBUG=true mcp-server-dev
项目结构
├── src/ # Source code
│ ├── index.ts # MCP server setup and tool definitions
│ └── scanner.ts # Core scanning functionality
├── build/ # Compiled JavaScript output
├── Dockerfile # Docker configuration for containerized setup
├── package.json # Project configuration and dependencies
└── tsconfig.json # TypeScript configuration
执照
麻省理工学院