Windows本地部署Excalidraw并实现远程协作
在当今远程办公和分布式团队日益普及的背景下，如何高效地进行可视化协作成了一个关键问题。一张随手画出的草图，往往比冗长的文字说明更能快速传达思路。而市面上大多数白板工具要么功能臃肿，要么依赖云端、数据不可控——直到我遇到了Excalidraw。
这是一款真正“为技术人设计”的开源绘图工具。它没有花哨的动画，却用极简的手绘风格让架构图、流程图看起来既专业又轻松；它不强制登录，却能通过简单配置实现多人实时协作；更重要的是，你可以完全掌控它的运行环境——本地部署、私有化访问、零数据外泄。
本文将带你从零开始，在Windows 系统上完整搭建一套可长期使用的 Excalidraw 协作服务，并通过内网穿透技术让团队成员无论身处何地都能加入编辑。整个过程无需云服务器，成本几乎为零，适合个人开发者、小团队甚至企业内部使用。
为什么选择 Excalidraw？
你可能已经用过 Miro、Whimsical 或者 Figma 白板，它们确实强大，但也有明显短板：需要联网、账号绑定、数据存储在第三方，对于涉及敏感信息的设计场景（比如系统架构、安全方案）来说风险较高。
而 Excalidraw 的核心理念是“本地优先 + 可选同步”：
- 默认情况下所有内容都保存在浏览器中，断网也能用；
- 支持一键导出
.excalidraw文件，加密分享无压力； - 开源代码透明，可自由审查与定制；
- 内置实验性 AI 功能，能根据文字描述自动生成图表；
- 最重要的是：它可以跑在你自己的电脑上，并通过公网链接邀请他人协作。
换句话说，你既能享受云端协作的便利，又能保留本地应用的安全与隐私。
GitHub 地址：https://github.com/excalidraw/excalidraw
如上图所示，无论是绘制技术架构、产品原型还是思维导图，Excalidraw 都能做到清晰直观，且自带“手绘感”，有效降低沟通中的压迫感。
准备工作：安装基础环境
要运行 Excalidraw，我们需要先配置好开发环境。虽然它是网页应用，但本地启动依赖 Node.js 和 Git。
安装 Node.js
前往官网下载 LTS 版本（推荐稳定性）：
https://nodejs.org/en/download/安装时注意勾选“Add to PATH”，否则后续命令行无法识别node命令。
安装完成后，打开 CMD 或 PowerShell 执行：
node -v npm -v如果返回类似v18.17.0和9.6.7的版本号，说明安装成功。
💡 小贴士：建议使用 Node.js 16~20 版本区间，过高或过低都可能导致依赖兼容问题。
安装 Git
Git 用于克隆项目源码，下载地址：
https://git-scm.com/download/win安装过程中建议选择“Use Git from the Windows Command Prompt”，这样可以在任意终端调用git命令。
验证是否安装成功：
git --version出现git version 2.x.x.windows.1即表示正常。
部署 Excalidraw 本地服务
一切准备就绪，现在我们正式开始部署。
克隆项目源码
打开命令行，执行：
git clone https://github.com/excalidraw/excalidraw.git这个命令会创建一个名为excalidraw的文件夹，并自动拉取最新代码。
进入目录：
cd excalidraw安装包管理器 Yarn
Excalidraw 使用 Yarn 管理依赖，先全局安装：
npm install -g yarn然后安装项目所需依赖：
yarn install首次安装可能需要几分钟，请耐心等待。如果遇到网络超时，可以尝试切换镜像源：
yarn config set registry https://registry.npmmirror.com再重新执行yarn install。
启动本地服务
一切就绪后，启动开发服务器：
yarn start启动成功后，终端会输出如下信息：
Local: http://localhost:3000 On Your Network: http://192.168.x.x:3000此时打开浏览器访问 http://localhost:3000，你应该能看到 Excalidraw 的主界面：
- 左侧是绘图工具栏（矩形、箭头、文字等）
- 中间是空白画布
- 右侧可调整主题、字体、线条样式
试着拖几个图形、连条线、写个标题——操作流畅，响应迅速，完全没有加载延迟。
✅ 到此为止，本地部署已完成。你现在拥有了一个完全私有的绘图环境。
但问题是：只有你自己能访问。怎么让同事也参与进来？
实现远程协作的关键：让服务对外可见
默认情况下，localhost:3000只能在本机访问，局域网内的其他设备都无法连接，更别说互联网上的用户了。
要实现远程协作，必须解决这个问题。常见方案有两种：
部署到云服务器（如 VPS、阿里云 ECS）
✅ 稳定持久，适合长期使用
❌ 成本高，还需域名备案、防火墙配置使用内网穿透工具暴露本地服务
✅ 零成本、快速上线、无需额外硬件
❌ 依赖第三方工具，需保持本地机器开机
本文采用第二种方式，推荐使用cpolar—— 一款对中文用户友好的内网穿透工具，支持 Windows 平台一键安装，且提供免费随机域名和固定子域名功能。
使用 cpolar 实现公网访问
下载与安装
访问 cpolar 官网：
https://www.cpolar.com点击【下载】→ 选择 Windows 版本 → 安装即可（建议保留默认路径）。
安装完成后，桌面会出现快捷方式。双击启动后，系统会在后台运行一个本地服务。
打开浏览器访问：
👉 http://localhost:9200
这是 cpolar 的 Web 管理界面。首次使用需注册账号并登录。
创建临时公网隧道
登录后，进入「隧道管理」→「创建隧道」，填写以下参数：
| 参数 | 设置值 |
|---|---|
| 隧道名称 | excalidraw-public |
| 协议 | http |
| 本地地址 | 3000 |
| 域名类型 | 免费随机域名 |
| 地区 | China VIP（低延迟推荐） |
点击【创建】后，系统会生成两个公网地址（HTTP 和 HTTPS），例如：
https://abcd1234.vip.cpolar.cn复制这个 HTTPS 链接，在外部网络的手机或另一台电脑上打开，你会发现——竟然可以直接访问你本地运行的 Excalidraw！
🎉 恭喜！你现在实现了跨地域访问。把这个链接发给同事，他们就能看到你的白板内容了。
不过要注意：这种免费域名是临时的，有效期 24 小时，重启或过期后就会失效。不适合长期协作。
升级为固定公网地址（推荐）
如果你希望拥有一个永久不变的专属链接，比如：
https://draw.myteam.com或者至少是一个固定的二级域名：
https://excalidraw-team.cpolar.cn那就需要使用 cpolar 的保留二级子域名功能。
步骤如下：
- 登录 Cpolar 仪表盘
- 进入左侧菜单「预留」→「保留二级子域名」
- 填写：
- 地区：China VIP
- 子域名：输入你喜欢的名字，如excalidraw-team
- 协议：http/https - 点击【保留】
保留成功后，你会获得一个固定的域名，例如：
excalidraw-team.cpolar.cn接下来回到本地 cpolar 管理界面（http://localhost:9200），找到之前创建的隧道，点击【编辑】，修改以下三项：
- 域名类型 → 二级子域名
- Sub Domain → 输入你保留的名称（如
excalidraw-team） - 地区 → 保持一致（China VIP）
点击【更新】后，公网地址将变为：
https://excalidraw-team.cpolar.cn从此以后，只要你的电脑开着、Excalidraw 正在运行，任何人都可以通过这个固定链接加入协作。
💡 提示：可以把yarn start和 cpolar 启动设置为开机自启，进一步提升可用性。
如何实现多人实时编辑？
到这里，你可能会问：“现在大家都能访问同一个页面了，能不能真正实现实时协作？比如看到对方光标、同步增删图形？”
答案是：可以，但需要额外配置协作后端。
Excalidraw 本身是一个纯前端应用，若想开启多人协同编辑，必须接入一个实时数据库来同步状态。官方推荐使用Firebase Realtime Database。
启用 Firebase 实时协作
第一步：注册 Firebase 账户
访问：
https://firebase.google.com/使用 Google 账号登录，创建一个新项目，例如excalidraw-collab。
第二步：启用 Realtime Database
在控制台中找到Realtime Database，点击创建数据库，选择“测试模式”（允许未授权读写，仅用于初期调试）。
记录下以下配置信息：
{ "apiKey": "your-api-key", "authDomain": "your-project-id.firebaseapp.com", "databaseURL": "https://your-project-id-default-rtdb.asia-southeast1.firebasedatabase.app", "projectId": "your-project-id" }第三步：配置本地项目
在 Excalidraw 项目根目录下创建.env.local文件，填入：
REACT_APP_FIREBASE_CONFIG={ "apiKey":"your-api-key", "authDomain":"your-project-id.firebaseapp.com", "databaseURL":"https://your-project-id-default-rtdb.asia-southeast1.firebasedatabase.app", "projectId":"your-project-id" }⚠️ 注意：JSON 必须写成一行字符串，不能换行或注释。
保存后重启服务：
yarn start再次打开页面，你会发现右上角多了一个「Live collaboration」按钮。点击后生成一个房间链接，分享给他人即可进入同一画布，实现实时编辑、光标追踪、动作同步。
🔗 官方文档参考：https://github.com/excalidraw/excalidraw/blob/master/src/firebase.md
尝试 AI 辅助绘图（实验性功能）
除了手动绘图，Excalidraw 社区还开发了多个 AI 插件，能够根据自然语言描述自动生成图表。
使用场景举例：
你想画一个微服务架构图，只需输入：
“画一个包含用户中心、订单服务、支付网关和 MySQL 数据库的系统架构，用箭头表示调用关系”
AI 插件就能自动生成初步布局，你只需微调位置和样式即可。
如何启用？
目前主流方案是使用第三方插件包：
👉 https://github.com/zsviczian/excalidraw-plugins
该仓库提供了包括 AI Assistant 在内的多个增强功能。安装方法详见其 README。
⚠️ 注意：AI 功能尚属实验阶段，生成结果仅供参考，不建议直接用于正式文档输出。
实用建议与注意事项
在实际使用中，结合我的实践经验，给出几点建议：
✅ 推荐做法
- 固定域名 + 开机自启：将
yarn start和 cpolar 添加到 Windows 启动项，确保服务持续可用。 - 结合 Notion / Confluence 使用：把白板截图或链接嵌入文档，作为会议纪要或设计稿附件。
- 定期导出备份：即使开启了 Firebase 同步，也建议定期导出
.excalidraw文件存档。 - 关闭自动同步敏感项目：涉及公司机密时，手动导出分享，避免意外上传。
❌ 需规避的风险
- 不要在公共网络随意分享公网链接，防止无关人员访问。
- 避免长时间依赖本地部署做关键协作，一旦电脑休眠或断电，服务即中断。
- Firebase 测试模式禁止用于生产环境，务必设置安全规则限制访问权限。
总结：打造属于你的私有化协作空间
我们一步步完成了整个部署流程：
- 在 Windows 上安装 Node.js 和 Git；
- 克隆并启动 Excalidraw 本地服务；
- 使用 cpolar 内网穿透，暴露公网访问地址；
- 配置固定子域名，实现长期稳定协作；
- （可选）接入 Firebase 实现实时编辑；
- （可选）尝试 AI 插件提升创作效率。
整套方案零费用、易维护、高度可控，特别适合中小团队构建轻量级协作平台。相比动辄订阅几百元/月的专业工具，这种方式不仅节省成本，更重要的是掌握了数据主权。
Excalidraw 的魅力在于它的“克制”——不做多余的功能，只专注于把一件事做好：让人与人之间的思想流动更自由。而当你亲手把它部署起来的那一刻，你就不再是工具的使用者，而是协作生态的构建者。
最后提醒一句：技术的价值不在于复杂，而在于能否真正解决问题。下次开头脑风暴前，不妨试试用自己搭建的 Excalidraw 白板，拉上队友一起“乱涂乱画”——也许最棒的创意，就藏在那一笔一划之间。
创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
