Accessibilityai

AccessibilityAI — 由 GroundLogic AI 打造

自主 WCAG 2.1 无障碍审计工具，使用 AI 视觉分析和 DOM 扫描来扫描、修复、重新验证，并生成 VPAT 2.5 EN 301 549 报告。

⚠️ Beta 版本 — AccessibilityAI 是早期原型。自动化工具只能检测约 40–60% 的无障碍问题。正式提交 VPAT 报告用于合规目的前，建议由认证专家进行人工审核。产品仍有待打磨之处——请使用下方表单分享反馈或报告 Bug。

[在此处添加演示 GIF]

---

反馈

AccessibilityAI 正在积极开发中。如果遇到问题，或有功能建议，我们希望了解。

→ 打开反馈表单

你也可以提交 GitHub Issue来报告 Bug。

---

功能介绍

AccessibilityAI 是一款开源 MCP 服务，可以：

1. 扫描 URL，使用 axe-core（DOM）和 Claude Vision（AI 截图分析）
2. 生成针对每项违规的精准、特定于框架的代码修复方案
3. 重新验证修复应用后的扫描结果，明确显示已解决的问题
4. 生成完整的 VPAT 2.5 EN 301 549 无障碍符合性报告（包含所有条款，支持 PDF + JSON）

它通过 Streamable HTTP 作为 MCP 服务运行，兼容 Claude Desktop、Claude Code、Cursor 以及任何 MCP 客户端。

---

快速开始

这是一个 pnpm monorepo。MCP 服务位于 artifacts/api-server/。

# 1. Clone and install
git clone https://github.com/groundlogic-ai-source/accessibility-ai
cd accessibility-ai
pnpm install

# 2. Install the Playwright browser (required for scanning)
npx playwright install chromium

# 3. Set environment variables
export DATABASE_URL="postgresql://user:pass@localhost:5432/accessibilityai"
# Or copy from a .env file — pnpm-workspace reads it automatically

# 4. Push the database schema
pnpm --filter @workspace/db run push

# 5. Start the MCP server
pnpm --filter @workspace/api-server run dev
# MCP endpoint:   http://localhost:8080/mcp
# Health check:   http://localhost:8080/api/healthz
# REST scan:      http://localhost:8080/api/scan  (no MCP client needed)

---

使用你自己的密钥

AccessibilityAI 采用**使用你自己的密钥（BYOK）**模式。每次调用工具时，你都需要提供自己的 Anthropic API 密钥——密钥绝不会被存储或记录，仅在该次请求期间使用。

你的密钥绝不会被保留。 完整详情请参阅 PRIVACY.md。

你可以在 console.anthropic.com 获取 Anthropic API 密钥。

---

MCP 工具

scan_accessibility

使用 DOM 分析和视觉 AI 扫描 URL，查找 WCAG 2.1 无障碍违规。

输入：

{
  "url": "https://example.com",
  "anthropic_api_key": "sk-ant-...",
  "scan_depth": "single_page",
  "max_pages": 1
}

输出：

{
  "scan_id": "uuid",
  "url": "https://example.com",
  "total_violations": 12,
  "violations_by_severity": { "critical": 2, "serious": 4, "moderate": 5, "minor": 1 },
  "estimated_fix_time": "2-4 hours",
  "violations": [...]
}

---

generate_fixes

接收扫描结果，并针对每项违规生成具体的代码修复方案。返回可直接粘贴到 Claude Code 或 Replit Agent 的补丁。

输入：

{
  "scan_id": "uuid-from-scan",
  "framework": "react",
  "anthropic_api_key": "sk-ant-..."
}

输出：

{
  "scan_id": "uuid",
  "fixes": [
    {
      "wcag_criterion": "1.1.1",
      "issue": "Image missing alt text",
      "before": "<img src=\"hero.jpg\">",
      "after": "<img src=\"hero.jpg\" alt=\"Hero banner showing product dashboard\">",
      "explanation": "...",
      "caveats": "..."
    }
  ],
  "copy_paste_summary": "Please fix the following accessibility violations in my codebase:\n..."
}

copy_paste_summary 字段的格式可直接粘贴到 Claude Code 或 Replit Agent。

---

re_verify

修复应用后重新扫描 URL，并与原始扫描结果进行比较。

输入：

{
  "scan_id": "original-scan-uuid",
  "anthropic_api_key": "sk-ant-..."
}

输出：

{
  "original_violations": 12,
  "current_violations": 3,
  "resolved": [...],
  "persisting": [...],
  "new_violations": [],
  "improvement_percentage": 75,
  "summary": "9 of 12 violations resolved (75% improvement). 3 violation(s) remain."
}

---

generate_vpat

生成完整的 VPAT 2.5 EN 301 549 无障碍符合性报告。返回 PDF（base64）和涵盖所有条款的结构化 JSON。

输入：

{
  "scan_id": "uuid-from-scan",
  "product_name": "My SaaS App",
  "product_version": "2.1.0",
  "company_name": "Acme Corp",
  "contact_email": "[email protected]",
  "anthropic_api_key": "sk-ant-..."
}

输出：

• vpat_json — 完整的结构化 VPAT 报告（涵盖所有 EN 301 549 条款）
• pdf_base64 — Base64 编码的 PDF，解码后保存为 .pdf
• overall_conformance_percentage — 符合 WCAG 2.1 A 级和 AA 级标准的比例

---

示例提示词

在连接到 AccessibilityAI 的 Claude Desktop、Claude Code 或任何 MCP 客户端中使用这些提示词：

1. 扫描网站并获取违规摘要：

Scan https://example.com for WCAG 2.1 accessibility violations using my Anthropic key sk-ant-... and give me a prioritized summary of what needs to be fixed.

2. 为特定框架生成代码修复方案：

Use the scan_id from the accessibility scan you just ran to generate React code fixes for all the violations. Format them so I can paste them directly into my codebase.

3. 重新验证修复并生成 VPAT 报告：

Re-verify https://example.com using the original scan_id to confirm my fixes resolved the issues, then generate a complete VPAT 2.5 compliance report for "Acme Corp" and return the PDF.

---

生产环境中的应用

AccessibilityAI 为医疗保健和政府部门的无障碍合规工作流提供支持，这些领域在采购时需要 VPAT 文档。各组织会使用它在人工审计前生成基线符合性报告，每个审计周期可节省 4-8 小时。

---

限制

• 自动化工具只能检测约 40–60% 的无障碍问题。建议由经过认证的无障碍专家进行人工审核，以获得完整的合规认证。
• 使用此工具生成的 VPAT 报告应在提交监管机构前进行审核。
• 全站扫描最多扫描 10 个页面。可能无法触及深层导航路径。
• EN 301 549 中非 Web 相关条款（硬件、语音、封闭软件）会标记为“未评估”——这些内容需要人工评估。
• 扫描结果保留 1 小时。结果过期后，请重新运行 scan_accessibility。

---

MCP 客户端配置

Claude Desktop

添加到 claude_desktop_config.json：

{
  "mcpServers": {
    "accessibility-ai": {
      "url": "https://your-deployed-instance.com/mcp",
      "transport": "streamable-http"
    }
  }
}

Claude Code / CLI

claude mcp add --transport http accessibility-ai https://your-deployed-instance.com/mcp

---

参与贡献

欢迎贡献。请：

1. Fork 仓库并创建功能分支
2. 遵循现有代码风格（TypeScript 严格模式，不使用 any）
3. 为更改的行为添加或更新测试
4. 提交 pull request，并附上清晰的说明

如需报告错误或提出功能请求，请创建 GitHub Issue，或使用反馈表单。

---

许可证

MIT — 详见 LICENSE。

GroundLogic AI — [email protected]