Flowzap MCP

🚀 FlowZap MCP 服務器

FlowZap MCP 服務器可藉助 Claude、Cursor、Windsurf 等 8 種以上支持 MCP 的工具，利用 AI 助手創建工作流、序列和架構圖。

FlowZap 是一款可視化工作流繪圖工具，擁有名為 FlowZap 代碼 的基於文本的領域特定語言（DSL）。此 MCP 服務器能讓 AI 助手為你創建圖表。

🚀 快速開始

FlowZap 藉助 FlowZap 代碼 DSL 將文本提示轉化為三重視圖圖表（工作流、序列和架構）。它既不是 Mermaid，也不是 PlantUML，而是一種專為簡化和 AI 生成設計的獨特領域特定語言。

✨ 主要特性

關鍵特性

• 僅使用 4 種形狀：圓形、矩形、菱形、任務框
• 節點屬性使用冒號：label:"文本"
• 邊標籤使用等號：[label="文本"]
• 處理句柄：n1.handle(right) -> n2.handle(left)
• 序列圖質量：每個跨泳道請求都需要匹配的響應邊；按時間順序定義邊；無孤立節點

📦 安裝指南

FlowZap MCP 服務器可與任何支持模型上下文協議（MCP）的工具配合使用：

所有兼容的編碼工具

不兼容的工具：Replit 和 Lovable.dev 僅支持通過 URL 訪問的遠程 MCP 服務器。請使用 公共 API 代替。

JSON 配置

所有工具都使用相同的 JSON 配置格式：

{
  "mcpServers": {
    "flowzap": {
      "command": "npx",
      "args": ["-y", "flowzap-mcp"]
    }
  }
}

Windows 用戶：如果工具未顯示，請使用絕對路徑：

"command": "C:\\Program Files\\nodejs\\npx.cmd"

使用 where.exe npx 查找你的 npx 路徑。

🔧 可用工具

核心工具

以代理為中心的工具

💻 使用示例

基礎圖表創建

向你的 AI 助手提出以下請求：

• "生成此應用中當前登錄流程的序列圖"
• "為訂單處理系統創建工作流圖"
• "為微服務 API 網關創建架構圖"
• "製作顯示用戶註冊流程的流程圖"
• "繪製包含構建、測試和部署階段的 CI/CD 管道圖"

以代理為中心的工作流

將 HTTP 日誌解析為圖表：

"這是我的 nginx 訪問日誌。創建一個顯示請求流程的序列圖。"

代理使用 flowzap_artifact_to_diagram 並指定 artifactType: "http_logs"。

分析圖表結構：

"此工作流中哪些步驟涉及數據庫？"

代理使用 flowzap_export_graph 獲取 JSON 圖，然後進行查詢。

顯示更改內容：

"我更新了工作流。與上一版本有何不同？"

代理使用 flowzap_diff 比較新舊代碼。

安全增量更新：

"在此圖表的 API 調用後添加一個日誌記錄步驟。"

代理使用 flowzap_apply_change 應用結構化補丁，而不是重新生成。

助手將執行以下操作：

1. 根據你的描述生成 FlowZap 代碼
2. 驗證代碼
3. 創建具有適當視圖（工作流、序列或架構）的遊樂場 URL，以便查看和共享

基礎用法

sales { # 銷售團隊
  n1: circle label:"訂單已接收"
  n2: rectangle label:"驗證訂單"
  n3: diamond label:"是否有效？"
  n1.handle(right) -> n2.handle(left)
  n2.handle(right) -> n3.handle(left)
  n3.handle(right) -> fulfillment.n4.handle(left) [label="是"]
}

fulfillment { # 履行
  n4: rectangle label:"處理訂單"
  n5: circle label:"完成"
  n4.handle(right) -> n5.handle(left)
}

🔧 技術細節

安全特性

• 無需身份驗證 - 僅使用公共 FlowZap API
• 不訪問用戶數據 - 無法讀取你的圖表或賬戶信息
• 本地運行 - MCP 服務器在你的機器上運行
• 防止 SSRF - 僅連接到 flowzap.xyz
• 速率限制 - 客戶端每分鐘限制 30 個請求
• 輸入驗證 - 最大代碼大小為 50KB

代理技能

通過 skills.sh 為 40 多種兼容的編碼代理安裝 FlowZap 技能：

npx skills add flowzap-xyz/flowzap-mcp

• skills.sh 列表：https://skills.sh/flowzap-xyz/flowzap-mcp/flowzap-diagrams
• 技能源代碼：skills/flowzap-diagrams/
• 兼容以下工具：Claude 代碼、Cursor、Windsurf、Codex、Gemini CLI、GitHub Copilot、Cline、Roo 代碼、Augment、OpenCode 等。

📚 詳細文檔

相關鏈接

• FlowZap 網站
• FlowZap 代碼文檔
• FlowZap MCP 博客
• 大語言模型上下文
• 模板庫
• npm 包
• GitHub 倉庫

📄 許可證

本項目採用 MIT 許可證。