Webclaw: Openclaw 技能的集中式 Web UI 与管理面板
作者:互联网
2026-03-29
什么是 Webclaw Dashboard?
Webclaw 作为 OpenClaw 生态系统的官方图形界面,将原始的命令行交互转化为精致的基于浏览器的体验。它提供了一个中心枢纽,通过包含动态表单、数据表和交互式 AI 聊天面板的响应式仪表板来管理每个已安装的技能。它采用 Next.js 和 FastAPI 等现代 Web 技术构建,确保开发者和终端用户都能访问、管理且安全地使用 Openclaw 技能。
该工具作为一个基础设施层,能够自动解析其他技能的元数据以渲染相应的 UI 组件。无论您是需要监控系统状态、管理用户角色,还是可视化复杂的数据集,Webclaw 都提供了必要的工具来扩展您的智能体操作,而无需为每项新功能编写自定义前端代码。
下载入口:https://github.com/openclaw/skills/tree/main/skills/mailnike/webclaw
安装与下载
1. ClawHub CLI
从源直接安装技能的最快方式。
npx clawhub@latest install webclaw
2. 手动安装
将技能文件夹复制到以下位置之一
全局模式~/.openclaw/skills/
工作区
/skills/
优先级:工作区 > 本地 > 内置
3. 提示词安装
将此提示词复制到 OpenClaw 即可自动安装。
请帮我使用 Clawhub 安装 webclaw。如果尚未安装 Clawhub,请先安装(npm i -g clawhub)。
Webclaw Dashboard 应用场景
- 将多个 Openclaw 技能的管理集中到一个单一、安全的 Web 界面中。
- 为非技术利益相关者提供用户友好的仪表板,以触发 AI 工作流并查看结果。
- 通过 HTTPS 和企业级 JWT 身份验证,实现对本地 AI 智能体的安全远程访问。
- 管理多用户环境,其中不同的团队成员通过基于角色的访问控制 (RBAC) 需要特定的访问级别。
- 通过动态图表、看板和可搜索的数据表可视化特定技能的数据。
- 仪表板通过扫描本地环境中的所有已安装 Openclaw 技能及其相应的模式定义进行初始化。
- 它配置高性能的 Nginx 反向代理,以处理传入的 Web 流量并保护 API 端点。
- 用户通过基于 JWT 的系统进行身份验证,该系统颁发短期访问令牌和安全的 httpOnly 刷新令牌。
- 当用户选择一项技能时,系统根据该技能的特定元数据动态渲染 UI 组件(如树形视图或图表面板)。
- 在后端于隔离环境中执行相应逻辑之前,所有请求的操作都会针对 RBAC 引擎进行验证。
- 实时更新和 AI 聊天交互会流式传输回浏览器,同时所有变更操作都会记录在本地审核日志中以供合规查阅。
Webclaw Dashboard 配置指南
要为您的 Openclaw 技能部署仪表板,请运行标准安装命令,然后配置您的环境:
# 安装 webclaw 基础设施
openclaw install webclaw
# 检查服务状态
using webclaw, show me the dashboard status
安装后,您必须访问浏览器中的 /setup 路由以创建主管理员账户。如果您部署到公共服务器,请立即启用 SSL:
# 使用 Let's Encrypt 配置 HTTPS
using webclaw, setup-ssl --domain your-dashboard-domain.com
Webclaw Dashboard 数据架构与分类体系
Webclaw 在本地 SQLite 数据库中组织其基础设施和安全数据。它还允许其他 Openclaw 技能定义自定义实体,以便自动进行 UI 渲染。
| 表名 | 用途 |
|---|---|
| webclaw_user | 存储管理员和用户账户,密码采用 PBKDF2 哈希。 |
| webclaw_role | 管理基于角色的访问控制的权限集。 |
| audit_log | 维护所有系统更改和技能执行的历史记录。 |
| chat_session | 持久化仪表板聊天界面的 AI 交互历史。 |
| webclaw_config | 存储系统级设置,包括域名和 SSL 状态。 |
name: webclaw
version: 2.0.0
description: >
Web dashboard for OpenClaw. Browser-based UI for any installed skill.
Schema-driven rendering, JWT auth, RBAC, AI chat, real-time updates.
Install web dashboard, manage users, configure SSL HTTPS, web admin panel.
author: AvanSaber / Nikhil Jathar
homepage: https://www.erpclaw.ai
source: https://github.com/avansaber/webclaw
tier: 0
category: infrastructure
requires: []
database: ~/.openclaw/webclaw/webclaw.sqlite
user-invocable: true
tags: [web, dashboard, ui, admin, login, ssl, https, users, roles]
metadata: {"openclaw":{"type":"executable","install":{"pre":"bash scripts/check_deps.sh","post":"bash scripts/install.sh","pip":"api/requirements.txt"},"requires":{"bins":["python3","node","npm","nginx","certbot","git","sudo"],"env":[],"optionalEnv":["WEBCLAW_DOMAIN"]},"os":["linux"]}}
cron:
- expression: "0 2 * * *"
timezone: "UTC"
description: "Clean expired sessions and check SSL cert renewal"
message: "Using webclaw, run the maintenance action."
announce: false
webclaw
You are the Web Dashboard administrator for this OpenClaw instance. You manage a browser-based UI that provides forms, tables, charts, and AI chat for every installed skill.
Security Model
- HTTPS enforced via Let's Encrypt (setup-ssl action)
- JWT authentication — access tokens (15 min) + refresh tokens (7 days, httpOnly cookies)
- RBAC — role-based permission checks before every skill action
- Rate limiting — 5/min auth, 30/min writes, 100/min general (nginx)
- Audit logging — all mutating actions logged to audit_log table
- Passwords hashed with PBKDF2-HMAC-SHA256 (600K iterations)
- Session invalidation on password change
Installation Requirements
This is an infrastructure package. Initial installation requires internet access and elevated privileges:
- Source: Clones application code from GitHub at a pinned release tag (
v2.0.0) - Dependencies: Installs Python and Node.js packages from standard registries within an isolated venv
- System services: Configures nginx reverse proxy and systemd services (requires sudo)
- SSL: Optional Let's Encrypt certificate via certbot
After installation, all runtime operations are local. No ongoing internet access is required for normal operation. No credentials or API keys are required. All data is stored locally in SQLite.
Skill Activation Triggers
Activate this skill when the user mentions: web dashboard, web UI, web interface, login page, HTTPS, SSL certificate, web users, roles, RBAC, nginx, web admin, dashboard access, browser access, setup web, install web dashboard.
Setup (First Use Only)
IMPORTANT: After installation, tell the user to open the setup page in their browser:
Open https://YOUR_SERVER/setup to create your admin account.
Steps:
- Open the URL shown in the install output (e.g.,
https://1.2.3.4/setup) - Create the first admin account (email + password)
- Log in — all installed skills appear in the sidebar
To enable HTTPS with a custom domain: say "Set up SSL for yourdomain.com"
Quick Start (Tier 1)
Check Status
Using webclaw, show me the dashboard status
→ runs: status
Enable HTTPS
Set up SSL for erp.example.com
→ runs: setup-ssl --domain erp.example.com
Create a Web User
Create a web user for alice@company.com with Manager role
→ runs: create-user --email alice@company.com --full-name "Alice" --role Manager
Reset a Password
Reset the web password for alice@company.com
→ runs: reset-password --email alice@company.com
All Actions (Tier 2)
| Action | Args | Description |
|---|---|---|
status |
— | Service status, SSL, user count |
setup-ssl |
--domain |
Configure HTTPS with Let's Encrypt |
renew-ssl |
— | Check + renew SSL certificate |
list-users |
— | List all web dashboard users |
create-user |
--email, --full-name, --role |
Create user with temp password |
reset-password |
--email |
Generate new temp password |
disable-user |
--email |
Disable a user account |
list-sessions |
— | Show active login sessions |
clear-sessions |
— | Force all users to re-login |
maintenance |
— | Cron: clean sessions, check cert |
restart-services |
— | Restart API + frontend services |
show-config |
— | Display current configuration |
Quick Command Reference
| User says | Action |
|---|---|
| "Is the dashboard running?" | status |
| "Set up SSL for example.com" | setup-ssl --domain example.com |
| "Who has web access?" | list-users |
| "Add web user bob@co.com" | create-user --email bob@co.com |
| "Reset password for bob" | reset-password --email bob@co.com |
| "Disable bob's web access" | disable-user --email bob@co.com |
| "Who's logged in?" | list-sessions |
| "Force everyone to re-login" | clear-sessions |
| "Restart the web dashboard" | restart-services |
| "Show web dashboard config" | show-config |
Proactive Suggestions
After create-user: remind user to share the temp password securely. After setup-ssl: confirm HTTPS redirect is working. After status shows ssl=false: suggest running setup-ssl. After status shows users=0: suggest opening /setup in browser.
Technical Details (Tier 3)
Architecture
- Frontend: Next.js 16 + React 19 + shadcn/ui + Tailwind v4 (port 3000)
- Backend: FastAPI + uvicorn (port 8001)
- Proxy: nginx (port 80/443) → routes /api to backend, / to frontend
- Database: SQLite at ~/.openclaw/webclaw/webclaw.sqlite
8 Generic UI Components
DataTable, FormView, DetailView, ChatPanel, ChartPanel, KanbanBoard, CalendarView, TreeView — all render dynamically from skill action responses.
Tables Owned
webclaw_user, webclaw_session, webclaw_config, webclaw_role, webclaw_user_role, webclaw_role_permission, chat_session, chat_message, audit_log
Script Path
scripts/db_query.py --action [--key value ...]
Per-Skill Customization
Skills can add a webclaw section to their SKILL.md frontmatter:
webclaw:
domain: "GRC & Audit"
database: "~/.openclaw/auditclaw/data.sqlite"
entities:
risk:
table: risk_register
name_col: risk_title
id_col: id
search_cols: [risk_category, severity]
相关推荐
专题
+ 收藏
+ 收藏
+ 收藏
+ 收藏
+ 收藏
最新数据
相关文章
行动建议器:人工智能驱动的潜客跟进建议 - Openclaw Skills
会话成本追踪器:优化 Token 投资回报率 - Openclaw Skills
Memoria: AI 智能体结构化记忆系统 - Openclaw Skills
Deno 运行时专家:安全 TypeScript 开发 - Openclaw Skills
为 AI 代理部署 Spark Bitcoin L2 代理 - Openclaw Skills
加密货币价格技能:实时市场数据集成 - Openclaw Skills
Happenstance:专业人脉搜索与研究 - Openclaw Skills
飞书日历技能:通过 Openclaw Skills 自动化日程安排
顾问委员会:多人格 AI 加密货币分析 - Openclaw Skills
CRIF:面向 AI Agent 的加密深度研究框架 - Openclaw Skills
AI精选
