Canvas（可视化画布）

Canvas 是一个轻量级可视化工作区，支持 HTML/CSS/JS、A2UI 以及小型交互式 UI 界面。

基本信息

状态存储：~/Library/Application Support/OpenClaw/canvas/
URL 方案：使用 openclaw-canvas:// scheme
示例：openclaw-canvas://main/ 映射到 /main/index.html
如果不存在 index.html，则显示内置脚手架
面板无边框、可调整大小，锚定在菜单栏附近
记住大小/位置
文件更改时自动重载
同时只显示一个面板
通过 设置 → Allow Canvas 禁用；禁用状态返回 CANVAS_DISABLED

Gateway WebSocket 控制

Canvas 通过 Gateway WebSocket 暴露。Agent 可以执行以下操作：

显示/隐藏画布
导航到指定页面
执行 JavaScript
捕获快照

CLI 命令

bash

# 显示画布
openclaw nodes canvas present --node <节点ID>

# 导航到指定页面
openclaw nodes canvas navigate --node <节点ID> --url "/"

# 执行 JavaScript
openclaw nodes canvas eval --node <节点ID> --js "document.title"

# 捕获快照
openclaw nodes canvas snapshot --node <节点ID>

navigate 接受本地路径、http(s) URL 和 file:// URL。"/" 显示脚手架或 index.html。

A2UI 支持

A2UI 由 Gateway 托管，在 Canvas 中渲染。首次打开时自动导航到 A2UI 主机。

默认 URL：http://<主机>:18789/__openclaw__/a2ui/
支持 A2UI v0.8 消息：beginRendering、surfaceUpdate、dataModelUpdate、deleteSurface
createSurface（v0.9）暂不支持

CLI 使用示例

bash

# 创建 A2UI 消息文件
cat > /tmp/a2ui-v0.8.jsonl <<'EOFA2'
{"type":"beginRendering"}
{"type":"surfaceUpdate","surface":{"id":"s1","html":"<h1>Hello</h1>"}}
EOFA2

# 推送 A2UI 消息
openclaw nodes canvas a2ui push --jsonl /tmp/a2ui-v0.8.jsonl --node <节点ID>

# 快速测试
openclaw nodes canvas a2ui push --node <节点ID> --text "Hello from A2UI"

深度链接触发 Agent 运行

Canvas 页面可以通过深度链接触发 agent 运行：

openclaw://agent?message=Review%20this%20design

JavaScript 示例：

javascript

window.location.href = "openclaw://agent?message=Review%20this%20design"

除非提供有效的 key，否则应用会提示确认。

安全机制

Scheme 阻止目录遍历攻击。
文件必须位于会话根目录下。
使用自定义 scheme，无回环服务器。
仅在显式导航时才允许外部 http(s) URL。

Canvas（可视化画布） ​

基本信息 ​

Gateway WebSocket 控制 ​

CLI 命令 ​

A2UI 支持 ​

CLI 使用示例 ​

深度链接触发 Agent 运行 ​

安全机制 ​