# Hermes WebUI 终极指南:在浏览器中掌控你的AI终端
**作者**: Mulight 沐光
**日期**: 2026-04-29T03:17:05.000Z
**来源**: [https://x.com/0xMulight/status/2049327083114168820](https://x.com/0xMulight/status/2049327083114168820)
---

Hermes WebUI 是专为 Hermes Agent打造的浏览器可视化控制台。它将原本局限于终端CLI的硬核操作,转化为全平台无缝衔接的图形化体验。无需复杂的环境配置,开箱即用。
- 开源仓库: github.com/nesquena/hermes-webui
- 技术栈: Python (无框架原生后端) + Vanilla JS (原生前端)
- 设计理念: 零框架、零构建、秒级启动。

## 为什么选择 WebUI?
相较于传统的命令行界面和其他同类工具,Hermes WebUI提供了无可替代的可视化优势:

## 核心功能说明
1. 极致的Agent交互体验
- 流式输出: 逐 Token 实时渲染,拒绝漫长等待。
- 深度思维可视化: 原生支持Claude Extended Thinking与o3 Reasoning思维链展示。
- 富文本渲染: 自动渲染 Mermaid流程图/架构图,工具调用卡片化展示,支持折叠与参数探查。
- 安全护栏: 针对高危 Shell命令,系统会自动弹窗拦截,需用户手动点击审批。
2. 沉浸式工作区
- 内嵌文件浏览器: 拥有目录树、面包屑导航。
- 实时编辑: 支持代码语法高亮、Markdown渲染、图片预览,修改后Ctrl+S直接写回本地磁盘。
- Git状态感知: 实时显示当前所在分支及未提交的变更文件数。
3. 全局掌控面板
- Memory (记忆面板): 查看、编辑或删除Agent提取的持久化上下文。
- Tasks (定时任务): 可视化管理Cron作业(如每日简报),支持一键执行、暂停或修改时间。
- Skills (技能中心): 浏览已安装技能,或直接连接技能商店一键扩展Agent 能力。

## 极速部署指南
> 前置要求: 请确保宿主机已成功安装并配置好Hermes Agent。
方案 A:原生一键启动(推荐,性能最佳)
系统会自动检测 Hermes Agent 路径,创建虚拟环境并唤起浏览器。
# 1. 获取源码
git clone https://github.com/nesquena/hermes-webui.git hermes-webui
cd hermes-webui
# 2. 启动服务
python3 bootstrap.py
# 或执行 ./start.sh
方案 B:Docker 容器化部署
适合希望保持宿主机环境纯净的用户。
docker run -d \
-e WANTED_UID=$(id -u) -e WANTED_GID=$(id -g) \
-v ~/.hermes:/home/hermeswebui/.hermes \
-v ~/workspace:/workspace \
-p 8787:8787 \
ghcr.io/nesquena/hermes-webui:latest

## 界面导览与高阶操作
访问 http://localhost:8787,界面采用经典的三栏式布局:
1. 左侧(会话中枢): 管理历史对话。支持按时间分组、标签颜色分类、关键词搜索。右键可执行置顶、归档、导出Markdown/JSON等操作。
2. 中央(交互主舞台): 聊天区域与仪表盘。底部状态栏实时显示当前模型、Token 用量进度与预估费用。
3. 右侧(资源管理器): 即你的物理工作区映射,支持点选文件并在中央区域弹窗编辑。
快捷斜杠命令速查:
命令执行效果
/help 调出命令说明书
/clear 清屏当前会话内容
/compress 压缩当前上下文,释放Token空间
/model 快速唤出模型切换菜单
/workspace 切换右侧关联的物理文件夹目录

## 移动端与远程漫游
Hermes WebUI具备完美的响应式设计,提供触控优化、抽屉式菜单及 Web Speech API语音输入,让你随时随地掏出手机就能控制 Agent。
如何实现远程访问?
- 局域网直连: 启动时绑定全网口 HERMES_WEBUI_HOST=0.0.0.0 python3 start.sh,手机浏览器访问 http://<电脑局域网IP>:8787。
- 异地组网 (Tailscale): 电脑与手机同时开启 Tailscale,通过系统分配的虚拟 IP 访问(极力推荐,兼顾便捷与安全)。
- 公网服务器 (SSH隧道): 本机执行 ssh -N -L 8787:127.0.0.1:8787 user@your-server.com。

Tailscale
推荐第二种方案,异地组网,直接把我这段发给hermes,他会教你怎么安装,需要下载什么,详情见下图。

## 进阶配置与避坑排错
环境变量高阶定制
你可以在启动前通过环境变量,或在 ~/.hermes/config.yaml中深度定制 WebUI:
# 网络与端口
HERMES_WEBUI_HOST=0.0.0.0
HERMES_WEBUI_PORT=8787
# 核心路径重定向
HERMES_WEBUI_AGENT_DIR=/custom/path/to/hermes-agent
HERMES_WEBUI_DEFAULT_WORKSPACE=/projects/my-code
# 安全与个性化
HERMES_WEBUI_PASSWORD=your_secure_password # 开启后网页需密码登录 (Cookie 24小时有效)
HERMES_WEBUI_BOT_NAME=Jarvis # 自定义 AI 名字
HERMES_WEBUI_DEFAULT_MODEL=openai/gpt-4o # 锁定默认启动模型
常见问题
- Q: 启动报错 "Hermes Agent not found"?
解决: 系统未能自动定位 Agent安装位置。请使用 HERMES_WEBUI_AGENT_DIR=/绝对路径/ python3 start.sh显式指定。
- Q: Docker 挂载文件后没有读写权限?
解决: 启动命令中必须携带宿主机用户映射:-e WANTED_UID=$(id -u) -e WANTED_GID=$(id -g)。
- Q: 右侧文件编辑后保存失败(Ctrl+S 无反应)?
解决: 检查当前启动 WebUI的用户对目标工作区目录Workspace是否有写权限。
@NousResearch @Teknium
## 相关链接
- [Mulight 沐光](https://x.com/0xMulight)
- [@0xMulight](https://x.com/0xMulight)
- [12K](https://x.com/0xMulight/status/2049327083114168820/analytics)
- [github.com/nesquena/hermes-webui](https://github.com/nesquena/hermes-webui)
- [https://github.com/nesquena/hermes-webui.git](https://github.com/nesquena/hermes-webui.git)
- [bootstrap.py](https://bootstrap.py/)
- [ghcr.io/nesquena/hermes-webui:latest](https://ghcr.io/nesquena/hermes-webui:latest)
- [start.sh](https://start.sh/)
- [start.sh](https://start.sh/)
- [@NousResearch](https://x.com/@NousResearch)
- [@Teknium](https://x.com/@Teknium)
- [Upgrade to Premium](https://x.com/i/premium_sign_up)
- [11:17 AM · Apr 29, 2026](https://x.com/0xMulight/status/2049327083114168820)
- [12.2K Views](https://x.com/0xMulight/status/2049327083114168820/analytics)
- [View quotes](https://x.com/0xMulight/status/2049327083114168820/quotes)
---
*导出时间: 2026/4/29 21:45:46*