Web 可访问性测试 MCP 服务器 (A11y MCP)
A11y MCP 是一个 MCP（模型上下文协议）服务器，它允许 LLM 访问 Web 可访问性测试 API。
该服务器使用 Deque Axe-core API 和 Puppeteer 允许 LLM 分析 Web 内容是否符合 WCAG 并识别可访问性问题。
注意：这不是 Deque Labs 的官方 MCP 服务器。
如果您喜欢这个项目，请留下一颗星！🌟
特征
测试网页：测试任何公共 URL 是否存在可访问性问题
测试 HTML 片段：测试原始 HTML 字符串是否存在可访问性问题
WCAG 合规性测试：根据各种 WCAG 标准（2.0、2.1、2.2）检查内容
可定制测试：指定要测试的可访问性标签/标准
规则探索：获取有关可用可访问性规则的信息
颜色对比度分析：检查颜色组合是否符合 WCAG 标准
ARIA 验证：测试 ARIA 属性的正确使用
方向锁定检测：识别强制特定屏幕方向的内容
Related MCP server: Web Accessibility MCP Server
安装
要将此服务器与 Claude Desktop 一起使用，您需要在 MCP 设置中对其进行配置：
**对于 macOS：**编辑'~/Library/Application Support/Claude/claude_desktop_config.json'文件
{
"mcpServers": {
"a11y-accessibility": {
"command": "npx",
"args": [
"-y",
"a11y-mcp-server"
]
}
}
}**对于 Windows：**编辑%APPDATA%\Claude\settings\claude_mcp_settings.json文件
**对于 Linux：**编辑~/.config/Claude/settings/claude_mcp_settings.json文件，将/path/to/axe-mcp-server/build/index.js替换为已编译服务器文件的实际路径。
可用工具
测试可访问性
测试 URL 是否存在可访问性问题。
参数：
url（必填）：要测试的网页的 URLtags（可选）：要测试的 WCAG 标签数组（例如，[“wcag2aa”]）
例子
{
"url": "https://example.com",
"tags": ["wcag2aa"]
}测试html字符串
测试 HTML 字符串是否存在可访问性问题。参数：
html（必需）：要测试的 HTML 内容
标签（可选）：要测试的 WCAG 标签数组（例如，[“wcag2aa”]）
例子
{
"html": "<div><img src='image.jpg'></div>",
"tags": ["wcag2aa"]
}获取规则
通过可选过滤获取有关可用可访问性规则的信息。
检查颜色对比度
检查前景色和背景色组合是否满足 WCAG 对比度要求。
参数：
foreground（必需）：十六进制格式的前景色（例如“#000000”）background（必需）：十六进制格式的背景颜色（例如“#FFFFFF”）fontSize（可选）：字体大小（以像素为单位）（默认值：16）isBold（可选）：文本是否为粗体（默认值：false）
例子
{
"foreground": "#777777",
"background": "#EEEEEE",
"fontSize": 16,
"isBold": false
}检查颜色对比度
检查 ARIA 属性在 HTML 中是否正确使用。
参数：
html（必需）：用于测试 ARIA 属性使用情况的 HTML 内容
例子
{
"html": "<div role='button' aria-pressed='false'>Click me</div>"
}检查方向锁
检查内容是否强制特定方向。
参数：
html（必需）：用于测试方向锁定问题的 HTML 内容
例子
{
"html": "<html><head><meta name='viewport' content='width=device-width, orientation=portrait'></head><body>Content</body></html>"
}响应格式
服务器以结构化的JSON格式返回可访问性测试结果：
{
"violations": [
{
"id": "color-contrast",
"impact": "serious",
"description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
"help": "Elements must meet minimum color contrast ratio thresholds",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast",
"affectedNodes": [
{
"html": "<div style=\"color: #aaa; background-color: #eee;\">Low contrast text</div>",
"target": ["div"],
"failureSummary": "Fix any of the following: Element has insufficient color contrast of 1.98 (foreground color: #aaa, background color: #eee, font size: 12.0pt, font weight: normal)"
}
]
}
],
"passes": 1,
"incomplete": 0,
"inapplicable": 2,
"timestamp": "2025-04-25T16:45:33.655Z",
"url": "about:blank",
"testEngine": {
"name": "axe-core",
"version": "4.10.3"
},
"testRunner": {
"name": "axe"
},
"testEnvironment": {
"userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/135.0.0.0 Safari/537.36",
"windowWidth": 800,
"windowHeight": 600,
"orientationAngle": 0,
"orientationType": "portrait-primary"
}
}依赖项
@modelcontextprotocol/sdk
木偶师
@axe-core/puppeteer
斧头核心