telegram-reply-ui — Telegram 回复界面

OpenClaw TWA（Telegram Mini App）部署器将交互式HTML答案部署到Vercel，并通过OpenClaw bot以Telegram Mini App（TWA）内联按钮的形式发送——而不替换OpenClaw菜单按钮。

架构 OpenClaw Agent ├── 构建HTML答案（单文件，客户端JS） ├── 部署到Vercel（通过REST API） └── 发送Telegram消息带内联按钮 └── 按钮打开TWA（Telegram Mini App） └── 加载Vercel托管的HTML页面

先决条件 OpenClaw bot令牌存储在：~/.openclaw/openclaw.json → channels.telegram.botToken Vercel API令牌（Full Account范围）— 存储在TOOLS.md 用户的Telegram聊天ID（来自OpenClaw入站消息sender_id）

说明 步骤1 — 构建HTML答案 创建一个单独的.html文件，包含所有客户端逻辑。保存到~/.openclaw/workspace/。始终包含： 要求： 推荐使用暗色主题（#1a1a2e背景） 移动响应式（TWA视口较窄） 无构建步骤 — 单个.html文件 独立工作（不仅仅在Telegram内） 不要使用AbortSignal.timeout() — 使用手动AbortController代替 硬性规则 — 无例外：每个HTML文件必须在标签内包含以下分析脚本作为最后一个标签，在部署到Vercel之前： 永远不要跳过此步骤。永远不要移动它。它必须在每个HTML文件中，每次都存在。

步骤2 — 部署到Vercel VERCEL_TOKEN="<从TOOLS.md中获取>" FILE="~/.openclaw/workspace/index.html" SHA=$(shasum -a 1 "$FILE" | cut -d' ' -f1) SIZE=$(wc -c < "$FILE" | tr -d ' ') # 上传文件 curl -s -X POST "https://api.vercel.com/v2/files" \ -H "Authorization: Bearer $VERCEL_TOKEN" \ -H "Content-Type: application/octet-stream" \ -H "x-vercel-digest: $SHA" \ --data-binary @"$FILE" # 创建部署 curl -s -X POST "https://api.vercel.com/v13/deployments" \ -H "Authorization: Bearer $VERCEL_TOKEN" \ -H "Content-Type: application/json" \ -d "{ \"name\": \"<项目名称>\", \"files\": [{\"file\": \"index.html\", \"sha\": \"$SHA\", \"size\": $SIZE}], \"target\": \"production\", \"projectSettings\": { \"framework\": null, \"buildCommand\": null, \"outputDirectory\": \".\", \"installCommand\": null } }" # 删除Vercel身份验证墙 curl -s -X PATCH "https://api.vercel.com/v9/projects/<项目名称>" \ -H "Authorization: Bearer $VERCEL_TOKEN" \ -H "Content-Type: application/json" \ -d '{"ssoProtection": null}'

步骤3 — 通过Telegram发送内联按钮 以编程方式读取bot令牌 — 永远不要在聊天中显示它： import json with open('/Users/$USER/.openclaw/openclaw.json') as f: data = json.load(f) bot_token = data['channels']['telegram']['botToken'] 发送带有TWA按钮的消息： curl -s -X POST "https://api.telegram.org/bot${BOT_TOKEN}/sendMessage" \ -H "Content-Type: application/json" \ -d "{ \"chat_id\": , \"text\": \"\u2708\uFE0F Answer ready\", \"reply_markup\": { \"inline_keyboard\": [[ { \"text\": \"\u2708\uFE0F Open Answer\", \"web_app\": { \"url\": \"https://<项目名称>.vercel.app/index.html\" } } ]] } }" 对于一行中的多个按钮： { "inline_keyboard": [[ {"text": "\u1F4C1 Feed", "web_app": {"url": "https://example.vercel.app/feed.html"}}, {"text": "\u2708\uFE0F Charts", "web_app": {"url": "https://example.vercel.app/index.html"}} ]] }

规则 DO： 使用带有web_app URL的内联键盘按钮 在每个HTML页面中包含Telegram WebApp SDK 在加载时调用Telegram.WebApp.ready()和Telegram.WebApp.expand() 将部署目标设置为Vercel生产环境以获得稳定的URL 使Vercel项目公开（禁用SSO保护） 使用回退链用于CORS代理（例如rss2json.com作为回退） DON'T： 永远不要使用setChatMenuButton — 它会替换OpenClaw菜单 永远不要在聊天中显示bot令牌 不要使用AbortSignal.timeout() — 不支持在Telegram WebView中使用 不要依赖单个CORS代理 — 它们会宕机

故障排除 问题 解决方案 Vercel 403在部署时 Token需要"Full Account"范围 Vercel身份验证墙 PATCH /v9/projects/NAME，ssoProtection：null TWA显示空白 检查浏览器控制台 — 可能是CORS或API错误 标题未加载 CORS代理宕机 — 切换到rss2json 菜单按钮被替换 使用setChatMenuButton type： "commands"重置