openclaw-tg-canvasTelegram Mini App Canvas with terminal and optional Control UI proxy. Renders agent-generated content (HTML, markdown, A2UI) in a Telegram Mini App; push wit...
Install via ClawdBot CLI:
clawdbot install clvv/openclaw-tg-canvasQ: Does the server auto-load ~/.openclaw/openclaw.json or any local credential file?
No. The server reads no local files for credentials. OPENCLAW_GATEWAY_TOKEN must be supplied explicitly via environment variable. The relevant code is the ENABLE_OPENCLAW_PROXY config block in server.js — verify it yourself.
Q: What is the default for ENABLE_OPENCLAW_PROXY?
Off. The code is const ENABLE_OPENCLAW_PROXY = process.env.ENABLE_OPENCLAW_PROXY === "true"; — it is only enabled if the string "true" is explicitly set in the environment. Omitting the variable leaves it disabled.
Q: What are the terminal/PTY endpoints and how are they authenticated?
GET /ws/terminal (WebSocket upgrade)verifyJwt() in the upgrade handler — same token issued by POST /auth after Telegram initData HMAC-SHA256 verification against BOT_TOKEN, restricted to ALLOWED_USER_IDS401 Unauthorized before a PTY is spawnedThis is a server skill. It includes a Node.js HTTP/WebSocket server (server.js), a CLI (bin/tg-canvas.js), and a Telegram Mini App frontend (miniapp/). It is not instruction-only.
Telegram Mini App Canvas renders agent-generated HTML or markdown inside a Telegram Mini App, with access limited to approved user IDs and authenticated via Telegram initData verification. It exposes a local push endpoint and a CLI command so agents can update the live canvas without manual UI steps.
cloudflared for HTTPS tunnel (required by Telegram Mini Apps).env file.
BOT_TOKEN=... MINIAPP_URL=https://xxxx.trycloudflare.com node scripts/setup-bot.js
node server.js
cloudflared tunnel --url http://localhost:3721
tg-canvas push --html "<h1>Hello</h1>"
tg-canvas push --markdown "# Hello"
tg-canvas push --a2ui @./a2ui.json
curl -X POST http://127.0.0.1:3721/push \
-H 'Content-Type: application/json' \
-d '{"html":"<h1>Hello</h1>"}'What the Cloudflare tunnel exposes publicly:
| Endpoint | Public? | Auth |
| --- | --- | --- |
| GET / | ✅ | None (serves static Mini App HTML) |
| POST /auth | ✅ | Telegram initData HMAC-SHA256 verification + ALLOWED_USER_IDS check |
| GET /state | ✅ | JWT required |
| GET /ws | ✅ | JWT required (WebSocket upgrade) |
| POST /push | ❌ loopback-only | PUSH_TOKEN required + loopback check |
| POST /clear | ❌ loopback-only | PUSH_TOKEN required + loopback check |
| GET /health | ❌ loopback-only | Loopback check only (read-only, low risk) |
| GET/WS /oc/* | ✅ (when enabled) | JWT required; only available when ENABLE_OPENCLAW_PROXY=true |
⚠️ Cloudflared loopback bypass:cloudflared(and other local tunnels) forward remote requests by making outbound TCP connections tolocalhost. This means all requests arriving via the tunnel appear to originate from127.0.0.1at the socket level — completely defeating the loopback-only IP check.PUSH_TOKENis therefore required and is enforced at startup. The loopback check is retained as an additional layer but must not be relied on as the sole protection.
Recommendations:
PUSH_TOKEN — the server will refuse to start without it. Generate one with: openssl rand -hex 32JWT_SECRET (32+ bytes).BOT_TOKEN, JWT_SECRET, and PUSH_TOKEN secret; rotate if compromised.ALLOWED_USER_IDS check in /auth is the primary access control gate for the canvas.ENABLE_OPENCLAW_PROXY is off by default. Only enable it if you need Control UI access through the Mini App and understand the implications (see below).The server can optionally proxy /oc/* to a local OpenClaw gateway, enabling you to access the OpenClaw Control UI through the Mini App.
This feature is disabled by default. To enable:
ENABLE_OPENCLAW_PROXY=trueWhen enabled, the server:
/oc/* HTTP and WebSocket requests to the local OpenClaw gateway.OPENCLAW_GATEWAY_TOKEN is set, injects it as Authorization: Bearer on proxied requests.The server does not read any local files for credentials — OPENCLAW_GATEWAY_TOKEN must be supplied explicitly via environment variable if needed.
When using /oc/* over a public origin, add that origin to OpenClaw gateway config:
{
"gateway": {
"controlUi": {
"allowedOrigins": ["https://your-canvas-url.example.com"]
}
}
}The Mini App includes an interactive terminal backed by a server-side PTY.
⚠️ This grants shell access to the machine running the server, as the process user. Anyone inALLOWED_USER_IDScan open a bash session and run arbitrary commands. Only add users you trust with shell access toALLOWED_USER_IDS.
How it works:
/ws/terminal (JWT required).Runtime scope: node-pty spawns a bash process as the server process user. No additional env vars control this; auth is the only gate.
tg-canvas push — push HTML/markdown/text/A2UItg-canvas clear — clear the canvastg-canvas health — check server health| Variable | Required | Default | Description |
| --- | --- | --- | --- |
| BOT_TOKEN | Yes | — | Telegram bot token for API calls and initData verification. |
| ALLOWED_USER_IDS | Yes | — | Comma-separated Telegram user IDs allowed to authenticate. Controls access to canvas, terminal, and proxy. |
| JWT_SECRET | Yes | — | Secret for signing session JWTs. Use 32+ random bytes. |
| PUSH_TOKEN | Yes | — | Shared secret for /push and /clear. Server refuses to start without it. Generate: openssl rand -hex 32 |
| MINIAPP_URL | Yes (setup only) | — | HTTPS URL of the Mini App, used by scripts/setup-bot.js to configure the bot menu button. |
| PORT | No | 3721 | HTTP server port. |
| TG_CANVAS_URL | No | http://127.0.0.1:3721 | Base URL used by the tg-canvas CLI. |
| ENABLE_OPENCLAW_PROXY | No | false | Set to the string "true" to enable /oc/* proxy to a local OpenClaw gateway. Off by default. The server does not read any local files to obtain a token — OPENCLAW_GATEWAY_TOKEN must be set explicitly if auth is needed. |
| OPENCLAW_GATEWAY_TOKEN | No | (unset) | Auth token injected as Authorization: Bearer on proxied /oc/* requests. Only used when ENABLE_OPENCLAW_PROXY=true. Must be supplied explicitly; no automatic file loading occurs. |
| OPENCLAW_PROXY_HOST | No | 127.0.0.1 | Hostname of the local OpenClaw gateway (proxy only). |
| OPENCLAW_PROXY_PORT | No | 18789 | Port of the local OpenClaw gateway (proxy only). |
| JWT_TTL_SECONDS | No | 900 | Session token lifetime in seconds (default 15 min). |
| INIT_DATA_MAX_AGE_SECONDS | No | 300 | Maximum age of Telegram initData (default 5 min). |
Generated Feb 27, 2026
Development teams use the canvas to share live code snippets, terminal outputs, and debugging visualizations in real-time within a secure Telegram group. This facilitates pair programming and code reviews without switching contexts, leveraging the JWT-gated terminal for direct server access.
Support agents push dynamic HTML dashboards to display customer metrics, ticket statuses, and resolution guides directly in a Telegram Mini App. The push API allows updates from backend systems, while the terminal enables troubleshooting server logs for escalated issues.
Instructors deliver interactive lessons with markdown-based slides and live coding examples through the canvas to students in a Telegram channel. The terminal feature allows real-time command demonstrations, and content updates are pushed via CLI as the lesson progresses.
Operations teams monitor system health by pushing live data visualizations (e.g., graphs, alerts) to the canvas from monitoring tools. The optional OpenClaw proxy integrates control UI for managing infrastructure, with access restricted to authorized user IDs.
Marketing teams use the canvas to preview and update campaign assets like HTML banners or analytics reports within Telegram. The push endpoint allows seamless updates from content management systems, while the terminal assists in backend data processing.
Offer a hosted version of the skill with enhanced features like multi-team canvases, analytics, and premium support. Charge monthly per user or team for access to the Telegram-integrated collaboration platform, targeting small to medium businesses.
Provide a free tier with basic canvas and push functionality, while monetizing advanced features such as increased user limits, custom domains, and priority terminal access. Upsell through in-app upgrades or enterprise licenses.
Deliver tailored implementations for enterprises needing specific integrations (e.g., with existing CRM or monitoring tools). Revenue comes from project-based fees for setup, customization, and ongoing maintenance services.
💬 Integration Tip
Ensure environment variables like BOT_TOKEN and PUSH_TOKEN are securely managed using secrets vaults, and test the Cloudflare tunnel configuration to avoid exposing sensitive endpoints publicly.
Display and control HTML content on connected Mac, iOS, or Android nodes via a web-based canvas with live reload and remote actions.
生成和编辑各种类型的图表（drawio、mermaid、excalidraw）。支持流程图、时序图、类图、ER图、思维导图、架构图、网络拓扑图等常见图表类型。能够根据自然语言描述创建新图表，也能读取并修改已有的 drawio/mermaid/excalidraw 文件。使用独立的 MCP server (mcp-diagram-generator) 生成图表文件，减少 token 消耗并保证输出一致性。支持自动配置管理，默认输出路径为项目目录下的 diagrams/{format}/，支持自定义路径和自动创建目录。
Create, export, and manage Canva designs via the Connect API. Generate social posts, carousels, and graphics programmatically.
Create software diagrams using Mermaid syntax. Use when users need to create, visualize, or document software through diagrams including class diagrams, sequence diagrams, flowcharts, ERDs, C4 architecture diagrams, state diagrams, git graphs, and other diagram types. Triggers include requests to diagram, visualize, model, map out, or show the flow of a system.
Generate and render diagrams from Mermaid syntax into PNG, SVG, or PDF using customizable themes and various diagram types.
Generate diagrams from descriptions with Mermaid, PlantUML, or ASCII for architecture, flows, sequences, and data models.