draw.io MCP Server

官方

在聊天中直接创建并渲染可交互的 draw.io 图表

分类: 其他第 20 / 230
Stars: ★ 5.6k 非常热门
传输方式: Streamable HTTP
运行环境: 远程托管（无需本地环境） · Node.js
凭据: 无需凭据
许可证: Apache-2.0
最近提交: 今天
工具数: 2

68FMRS · C

官方 draw.io MCP App Server,通过托管的 mcp.draw.io 端点在聊天中内嵌渲染可交互图表,提供 create_diagram 与 search_shapes 两个工具,无需安装但默认会将图表数据发往云端,可自托管以满足数据合规需求。

最强项 · 文档质量 16/20 最弱项 · 可靠性 9/20

可靠性

9/20

安全与权限

14/20

维护活跃度

15/20

文档质量

16/20

安装易用性

14/20

查看各项评分依据

可靠性 9/20: 清单声明了一个远程 streamable-http 端点和两个工具(create_diagram、search_shapes),README中对工具行为的描述内部一致,并有一个GitHub Action自动刷新形状索引。但审查材料中没有验证MCP服务器自身请求/响应处理(初始化握手、工具调用、错误路径)的测试文件或CI工作流,因此“happy path”仅在文档层面看似可信,未被验证。根据静态校准规则,可靠性上限为12分;由于完全未披露两个工具的错误处理、重试行为或边界情况文档,实际得分进一步降低至9分。
安全与权限 14/20: 不涉及凭据、令牌或破坏性/不可逆操作;两个工具(图表创建与形状搜索)是读取/渲染性质的,没有文件系统或远程命令的副作用。README中的“数据驻留与离线使用”部分异常透明,明确披露托管端点(mcp.draw.io)会将图表内容发送到draw.io自己的服务器,并提供自托管方案以避免此情况,这是很强的加分项。但该server.json实际指向的托管远程服务默认会将用户图表数据发送到第三方服务,且没有运行时确认步骤,仅有文档层面的披露,也未明确说明公共端点的访问范围/速率限制,因此未达到完全的最小权限/明确确认标准,未触及红线,故不适用0-4分。
维护活跃度 15/20: 该仓库是jgraph(draw.io所属组织)维护的官方项目,未被归档,采用Apache-2.0许可,在5130星标下仅有1个未解决issue,表明问题响应较为及时。一个GitHub Action(update-search-index.yml)会自动使形状索引与上游draw.io发布保持同步,显示出活跃的自动化维护流程,清单也采用了语义化版本号(1.0.3)。但审查材料中未提及SECURITY.md或明确的漏洞披露渠道,也看不到更新日志或发布节奏信息,因此未给满分。
文档质量 16/20: 该MCP服务器的文档分层程度不同寻常:顶层README用表格对比了四种集成方式,链接到各组件的独立README,记录了四种方式共用的规范化XML生成参考文档,解释了形状搜索索引的生成与刷新流程,并专门设有“数据驻留与离线使用”章节,以表格形式列出各方式下图表数据是否离开本机及具体缓解措施(VIEWER_PATH、DRAWIO_BASE_URL、DRAWIO_ICON_SERVICE_URL)。这大大超出了对局限性和成本/数据流权衡的常规披露水平。扣分项:审查材料中未记录两个工具的正式参数模式(可接受的XML大小、速率限制、错误响应、超时行为),只有叙述性的工具描述,留下了一些隐藏的操作假设。
安装易用性 14/20: 对于本次审查的server.json目标(MCP App Server,托管远程),安装步骤极简:无需安装,只需将URL https://mcp.draw.io/mcp 添加为远程MCP服务器,并提供了Cursor的一键安装链接,同时声明兼容Claude.ai、VS Code及任何支持MCP Apps的宿主。文档还提供了自托管替代方案(本地Node.js或Cloudflare Workers)以满足更严格的数据驻留需求。根据静态校准规则,在没有提交的测试/CI证明所述步骤端到端可行的情况下,安装易用性上限为15分;鉴于所述步骤清晰简洁,评分设为上限,但该结论并未通过实际执行独立验证。

静态评测 · 未实际运行收录于 2026-08-26

查看 FMRS 评分方法 →

选型与风险

能访问什么访问网络

适合谁

希望在聊天中直接预览内嵌图表、无需切换窗口的用户
在 Claude.ai 或 Cursor 中协作构思架构图或流程图的团队
可以接受使用官方托管 mcp.draw.io 端点的用户

不适合谁

需要本地 .drawio 文件、PNG/SVG/PDF 导出或 Mermaid/CSV 输入的用户(应使用 MCP Tool Server 或 Assistant Plugins)
对数据合规有严格要求、不能将图表 XML 发送到托管 mcp.draw.io 端点的环境(需自托管)
使用不支持 MCP Apps 扩展的 MCP 客户端的用户(此时图表只能以文本形式返回)

所需权限

除非自托管,否则会将图表 XML 数据发送到官方托管的 mcp.draw.io 端点
默认会从 app.diagrams.net / viewer.diagrams.net 加载 draw.io 查看器应用代码
作为托管远程服务器使用时,不需要访问本地文件系统或系统资源

风险与副作用

使用默认 mcp.draw.io 端点时,图表内容会被发送到 draw.io 的托管服务器
除非构建时设置 VIEWER_PATH,否则会默认向 app.diagrams.net/viewer.diagrams.net 发起加载查看器代码的外部请求
内嵌渲染依赖客户端支持 MCP Apps 扩展,否则只会返回原始 XML 文本而非可视化图表

安装接入

准备工作

运行环境：远程托管（无需本地环境） · Node.js

其他可选配置项（4 个）

VIEWER_PATH 可选 App Server 构建变量，用于内联 viewer 代码，替代从 viewer.diagrams.net 加载，减少外部请求。

DRAWIO_BASE_URL 可选 Tool Server 环境变量，指向自托管的 draw.io 实例，替代默认的 app.diagrams.net。

DRAWIO_ICON_SERVICE_URL 可选设置自托管的图标服务地址以覆盖 icons.diagrams.net，或设为 off 禁用图标补充。

DEBUG 可选 Cloudflare 托管的 App Server 设为 true 时会在日志中记录响应体。

在 Claude.ai、Cursor 或其他支持 MCP Apps 的客户端设置中,将 https://mcp.draw.io/mcp 添加为远程 MCP 服务器 URL 即可使用,无需安装。若需自托管,可克隆仓库后执行 cd mcp-app-server && npm install && npm start 在本地运行,或部署到 Cloudflare Workers;自托管时可通过 VIEWER_PATH 环境变量将查看器代码内联,减少对 viewer.diagrams.net 的外部请求。

.cursor/mcp.json

{"mcpServers": {"drawio": {"url": "https://mcp.draw.io/mcp"}}}

以 Cursor 为例。其他客户端的配置文件位置或字段可能不同（如 VS Code 使用 servers 字段），可用下方配置生成器转换。

.vscode/mcp.json

{
  "servers": {
    "drawio": {
      "url": "https://mcp.draw.io/mcp"
    }
  }
}

写入项目的 .vscode/mcp.json（VS Code 使用 servers 字段）。

Terminal

claude mcp add --transport http drawio https://mcp.draw.io/mcp

在终端运行；先把 <…> 占位符换成你自己的值。

生成并校验客户端配置

验证是否装好

将 https://mcp.draw.io/mcp 添加为远程 MCP 服务器后，客户端工具列表中应出现 create_diagram 和 search_shapes 两个工具；调用 create_diagram 传入简单的 draw.io XML，若宿主支持 MCP Apps 应在聊天中内联渲染出交互式图表。

常见排障

若图表未内嵌渲染,请确认所用客户端是否支持 MCP Apps 扩展
Cursor 版本低于 2.6 时,请改用基于 stdio 的 @drawio/mcp Tool Server
对数据驻留要求严格的场景,建议通过 Node.js 或 Cloudflare Workers 自托管,而非使用官方托管端点
在调用 create_diagram 之前先使用 search_shapes 获取正确的形状样式字符串

试试这样问

连接成功后，可以直接对 AI 助手这样说：

用 search_shapes 帮我找一个 AWS Lambda 的图形，然后画一个 Lambda 函数调用 S3 的流程图
画一个包含三个微服务交互的架构图，并使用 ELK 自动布局（postLayout: "elk"）
搜索 Kubernetes 相关的形状，然后创建一个 Pod 和 Service 的示意图
创建一个深色模式的 BPMN 流程图，并用 libavoid 正交路由连接线（routing: "libavoid"）

工具能力 2

create_diagram 写入

将 draw.io XML 渲染为聊天中可交互的内嵌图表

search_shapes 只读

在 draw.io 全部形状库中按关键词搜索,返回可直接用于 XML 的精确样式字符串

使用场景

在对话过程中直接勾画架构图

内嵌可视化流程图、UML、网络拓扑图和 BPMN 图

搜索并插入样式正确的形状(如 AWS、Azure、GCP、Cisco、Kubernetes 图标等)到图表中

支持客户端

Claude.ai

Cursor

VS Code部分支持

依据项目文档列出，未经本站实测。

详细介绍

draw.io MCP App Server 是 draw.io 官方提供的 MCP 服务器,通过 MCP Apps 协议将图表以可交互的内嵌 iframe 形式直接渲染在聊天对话中,无需跳转浏览器。官方托管地址为 https://mcp.draw.io/mcp,可直接作为远程 MCP 服务器添加到 Claude.ai、Cursor 或任何支持 MCP Apps 的客户端,无需安装;也可以通过 Node.js 本地运行或部署到 Cloudflare Workers 自托管。服务器提供两个工具:create_diagram 用于将 draw.io XML 渲染为聊天内的交互式图表,search_shapes 用于在超过 10,000 个 draw.io 形状库(AWS、Azure、GCP、P&ID、电气、Cisco、Kubernetes、UML、BPMN 等)中按关键词搜索,并在内置库无合适匹配时补充调用 draw.io 图标服务,返回可直接用于 XML 的精确样式字符串。