SnappySnag

SnappySnag Model Context Protocol（MCP）服务

SnappySnag 官方 Model Context Protocol（MCP） 集成，可将 Flutter 应用内的错误报告、标注、屏幕诊断和设备日志无缝接入 Cursor、Windsurf、Claude Desktop 及其他 AI 编码助手。

---

⚡ 什么是 SnappySnag MCP？

测试 Flutter 应用时，QA 测试人员和最终用户可以直接在移动设备屏幕上标记视觉错误或异常行为。SnappySnag 会采集：

• 精确的视觉标注坐标和反馈评论
• 带标注的高分辨率截图
• 当前屏幕类和 Widget 树层级结构
• 实时设备日志（OS、平台、版本、设备元数据）
• AI 生成的根因分析和解决提示

使用 SnappySnag MCP 服务后，你的 AI 编码 Agent（在 Cursor、Windsurf、Claude 等中）可以直接检查这些错误报告，快速跳转到相关的 Flutter Widget 代码、实现修复并将工单标记为已解决，全程无需离开编辑器。

---

🛠️ 可用的 MCP 工具

工具	描述	关键参数
get_latest_feedback	获取最新的错误报告或用户反馈及完整详情（当前标注、截图、元数据、设备信息）。	status（open | all）、include_screenshot（true | false）
list_feedbacks	搜索并列出符合筛选条件（状态、严重程度、关键词）的反馈工单。返回精简摘要。	status（open | resolved | ignored | all）、severity、source、keyword、limit
get_feedback_detail	获取指定反馈 ID 的完整详情，包括截图、当前标注和讨论备注。	feedback_id（必需）、include_screenshot
update_feedback_status	更新工单状态（resolved / ignored / open），并可选择附上开发者解决备注。	feedback_id（必需）、status（必需）、comment

---

🚀 快速开始 / 配置

SnappySnag 支持两种连接方式：

1. 选项 A（命令 / stdio，演示模式）：通过标准 MCP stdio 在本地运行。如果未提供密钥，则会启用交互式 演示模式，并提供模拟的 Flutter 错误工单！
2. 选项 B（远程 SSE / Streamable HTTP）：直接连接到 SnappySnag 托管的端点，无需任何本地依赖。

---

1. 获取 MCP Secret Key（演示模式下可选）

1. 登录 SnappySnag Dashboard。
2. 打开 Project Settings（齿轮图标）-> Integrations 或 MCP 选项卡。
3. 点击 Generate MCP Secret Key，然后复制密钥（snag_mcp_...）。

---

2. 配置 AI 编辑器

🔹 选项 A：命令 / stdio（npx 或本地构建）

Cursor（.cursor/mcp.json）

{
  "mcpServers": {
    "snappysnag": {
      "command": "node",
      "args": ["path/to/snappy-snag-mcp/dist/index.js", "--key=YOUR_MCP_SECRET_KEY"]
    }
  }
}

（提示：省略 --key 或设置 --key=demo，即可使用演示数据进行测试！）

Claude Desktop（claude_desktop_config.json）

{
  "mcpServers": {
    "snappysnag": {
      "command": "node",
      "args": ["path/to/snappy-snag-mcp/dist/index.js", "--key=YOUR_MCP_SECRET_KEY"]
    }
  }
}

---

🔹 选项 B：Streamable HTTP（远程 SSE）

Cursor（.cursor/mcp.json）

{
  "mcpServers": {
    "snappysnag": {
      "url": "https://snappysnag.com/api/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_MCP_SECRET_KEY"
      }
    }
  }
}

Windsurf（~/.codeium/windsurf/mcp_config.json）

{
  "mcpServers": {
    "snappysnag": {
      "serverUrl": "https://snappysnag.com/api/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_MCP_SECRET_KEY"
      }
    }
  }
}

---

💡 示例提示词工作流

连接后，你可以直接用自然语言向 AI 助手下达指令：

“检查 SnappySnag 中最新的未解决错误报告，并修复问题。”

AI Agent 将会：

1. 调用 get_latest_feedback(status: "open")，检查报告中的屏幕、标注位置和设备规格。
2. 读取仓库中引用的 Flutter Widget 文件。
3. 应用必要的代码修复或布局调整。
4. 调用 update_feedback_status(feedback_id: "...", status: "resolved", comment: "Fixed overflow in ProductCard layout")。

---

🔒 安全与隐私

• 按项目限定密钥：每个 MCP Secret Key 都严格限定于指定项目。
• 即时撤销：如果密钥遭到泄露，可在控制面板中单击一下即可重新生成或撤销。
• 加密传输：所有数据和截图资源均通过 HTTPS 传输，并使用短时有效的签名 URL。

---

📚 资源与链接

• SnappySnag 官方网站：https://snappysnag.com
• Flutter SDK (snappy_snag)：pub.dev/packages/snappy_snag
• Model Context Protocol（Anthropic）：modelcontextprotocol.io

---

📄 许可证

本仓库采用 MIT License 许可。