Web Compat MCP服务器
MCP服务器为整个Web平台提供浏览器兼容性数据。
回答问题： _“这在浏览器中真的有效吗？”_
完全离线 --所有数据都通过npm包捆绑在一起。无API调用，无延迟。
🇯🇵 日语版README在这里
建筑
┌─────────────────────────────────────────────┐
│ web-compat-mcp server │
│ │
│ ┌───────────────┐ ┌───────────────────┐ │
│ │ @mdn/browser- │ │ web-features │ │
│ │ compat-data │ │ (W3C WebDX CG) │ │
│ │ 15K+ features│ │ 1K+ features │ │
│ │ BCD JSON │ │ Baseline status │ │
│ └───────┬───────┘ └────────┬──────────┘ │
│ │ cross-reference │ │
│ └────────┬──────────┘ │
│ │ │
│ ┌────────▼────────┐ │
│ │ 7 MCP Tools │ │
│ └────────┬────────┘ │
│ │ stdio │
└───────────────────┼─────────────────────────┘
│
MCP Client (Claude, etc.)工具
| 工具 | 说明 |
|---|---|
compat_check | 检查单个功能的浏览器兼容性（BCD点表示法） |
compat_search | 按关键字搜索15000+BCD特征 |
compat_get_baseline | 获取web功能的基线状态（web功能烤肉串案例） |
compat_list_baseline | 列出按基线状态筛选的功能 |
compat_compare | 并排比较2-5个功能的浏览器兼容性 |
compat_list_browsers | 列出所有跟踪的浏览器及其版本 |
compat_check_support | 查找特定浏览器版本中添加的功能 |
标识符约定
这两个数据源使用不同的标识符方案，每个工具都需要一个特定的标识符方案：
| 工具 | 方案 | 示例 |
|---|---|---|
compat_check, compat_compare, compat_search | BCD点符号 --细粒度，通常为驼色病例 | api.PushManager, css.properties.grid |
compat_get_baseline, compat_list_baseline | 网络特征烤肉串案例 --粗糙的特征组 | push, container-queries |
compat_check_support | 浏览器id+版本字符串 | safari + 17 |
BCD是细粒度的(api.PushManager, api.PushEvent, api.PushSubscription 是单独的条目），而web功能将相关规格分组为单个功能(push 涵盖所有三个）。当不确定确切的标识符时，运行 compat_search 第一。输入规范化处理烤肉串案例查询(view-transition → viewtransition)和尾随 .0 版本(17.0 → 17)自动。
快速开始
npx（不安装）
npx @shuji-bonji/web-compat-mcpnpm（全局）
npm install -g @shuji-bonji/web-compat-mcp
web-compat-mcpMCP客户端配置
克劳德桌面版
添加 claude_desktop_config.json:
{
"mcpServers": {
"web-compat": {
"command": "npx",
"args": ["-y", "@shuji-bonji/web-compat-mcp"]
}
}
}克劳德代码
claude mcp add web-compat -- npx -y @shuji-bonji/web-compat-mcpVS代码（复制/继续）
添加 .vscode/mcp.json:
{
"servers": {
"web-compat": {
"command": "npx",
"args": ["-y", "@shuji-bonji/web-compat-mcp"]
}
}
}使用示例
检查浏览器兼容性
“Safari中是否支持Push API？”
→ compat_check feature: "api.PushManager"返回跨浏览器的版本支持、基线状态和MDN/spec文档的链接。
搜索功能
“查找CSS网格功能”
→ compat_search query: "grid" category: "css"返回具有标准/实验/弃用标志的匹配功能ID。
比较功能
“比较fetch和XMLHttpRequest”
→ compat_compare features: ["api.fetch", "api.XMLHttpRequest"]返回带有版本支持和基线状态的并排比较表。
检查基线状态
“容器查询是基线吗？”
→ compat_get_baseline feature: "container-queries"返回基线级别（广泛可用/新可用/非基线）、浏览器支持和相关BCD功能。
按浏览器版本查找功能
“Chrome 120中添加了哪些CSS功能？”
→ compat_check_support browser: "chrome" version: "120" category: "css"返回在指定浏览器版本中添加的功能。
工作流程：组合多种工具
“我想在我的PWA中使用Push API——今天现实吗？”
Step 1 → compat_check feature: "api.PushManager"
# Per-API browser versions (Chrome 42+, Safari 16+, Firefox 44+)
Step 2 → compat_get_baseline feature: "push"
# Feature-group view: Newly Available since 2023-03-27
Step 3 → compat_compare features: ["api.PushManager", "api.Notification"]
# Side-by-side when your PWA depends on both与面向规范的服务器链接，例如 W3C MCP 或 RFCXML-MCP，法学硕士可以回答这两个问题 _“规格要求什么？”_ 和 _“今天浏览器中真正起作用的是什么？”_ 在一次谈话中。
输出格式
所有工具支持 response_format 参数：
"markdown"（默认）--人类可读的表格和格式化文本"json"--结构化数据structuredContent用于程序化使用
补充MCP服务器
此服务器旨在与其他MCP服务器协同工作：
| 服务器 | 角色 | 此服务器的补充 |
|---|---|---|
| W3C MCP | 规范定义（必须/应该/可能） | 实际浏览器实现状态 |
| RFCXML-MCP | RFC要求 | 浏览器级协议支持 |
| css-mcp | CSS文档+代码分析 | 平台范围内的兼容性+基线 |
数据源
发展
# Install dependencies
npm install
# Build
npm run build
# Run tests
npm test # Unit tests (66 tests)
npm run test:e2e # E2E tests via JSON-RPC (10 tests)
# Lint & format (Biome 2.x)
npm run lint # Check
npm run lint:fix # Auto-fix
npm run format # Format
# Type check
npm run typecheck许可证
麻省理工学院——见 许可证