AI自动化

免费解锁 Claude 同款三栏工作区:Hermes WebUI 自托管指南(2026)

2026 年 Hermes WebUI 自托管 Claude 同款三栏 AI Agent 工作区

引言

Claude 网页版把一种布局做到了极致,许多重度用户不愿放弃:左侧历史中间对话右侧 Artifacts / 文件。问题在于 每月 20 美元 的订阅费与会话速率限制——偶尔聊天够用,做 Agent、工具循环和日常研究就很痛苦。

Hermes WebUI(截至 2026 年 GitHub 星标已超 1 万)是 Hermes Agent(Nous Research 的自进化 Agent 运行时)的社区 Web 前端。你无需重写 Agent 代码,一条 Docker 命令(或 docker compose up)即可获得深色三栏界面,带实时工具调用卡片Workspace 文件浏览器,体验比纯终端更接近 Claude 产品 UI。

本指南面向想要自托管 AI 聊天 UIClaude 同款开源界面且不愿按席位付 SaaS 费用的读者,是一份实用的 Hermes WebUI 教程,涵盖架构、安装、安全与六个常见避坑点。

若你已在别处运行 Agent,可对照我们的 OpenClaw 多智能体路由指南——Hermes 还提供 hermes claw migrate 供 OpenClaw 用户迁移。

什么是 Hermes WebUI(以及它不是什么)

可引用定义: Hermes WebUI 是 Hermes Agent 的浏览器外壳——提供 Claude 式布局、流式工具可视化与 Workspace 文件树,模型、工具与记忆由后端 Agent 进程处理。
层级 项目 职责
UI nesquena/hermes-webui React Web 应用,端口 8787,三栏 UX
Agent NousResearch/hermes-agent 工具执行、技能、网关(Telegram/Discord)、记忆
配置 ~/.hermes/config.yaml 模型、API 密钥、工具白名单
Workspace ~/workspace(默认) Agent 读写的文件——显示在右侧栏

Hermes WebUI 不是托管版 Claude API 克隆。你通过 hermes model 自带模型密钥(Anthropic、OpenRouter、Nous Portal、本地端点等),灵活度与 CLI 相同,文档见 hermes-agent.nousresearch.com/docs

贴近「Claude 工作区」心智模型的界面功能

三栏布局

栏位 典型内容
左侧 会话列表、历史记录、快速切换
中间 流式聊天、Markdown、中断与重定向
右侧 Workspace——实时文件树、预览、类 Artifact 输出

深色模式与工具透明化

不同于扁平聊天气泡,Hermes WebUI 会实时展开工具调用——Shell 命令、文件编辑、搜索——以卡片形式呈现,无需翻日志。这正是 Claude 重度用户留在网页端、而非仅用 API 脚本的原因。

Workspace 文件浏览器

右侧栏对应挂载的 /workspace 目录(主机路径可配置)。Agent 写入图表、代码或报告时,浏览器中即时可见——比 ChatGPT 单线程视图更接近 Claude Artifacts + 项目文件。

官方演示与截图:GitHub 上的 Hermes WebUI社区演示站

Claude / ChatGPT 网页版 vs Hermes WebUI(决策矩阵)

维度 Claude 网页($20/月) ChatGPT Plus Hermes WebUI(自托管)
布局 三栏 + Artifacts 以单线程为主 三栏 + Workspace 浏览器
速率限制 会话上限 模型上限 仅受你的硬件与 API 配额限制
数据驻留 Anthropic 云端 OpenAI 云端 你的本机 / VPS
Agent 工具 绑定产品能力 插件 / GPTs 40+ Hermes 工具、定时任务、子 Agent
上手成本 Docker + API 密钥(约 15 分钟)
移动端 官方 App 官方 App 浏览器访问你的服务器(SSH 隧道)

推荐路径:

  • 只需偶尔聊天、追求零运维 → 继续用 Claude/ChatGPT。
  • 触达限制、需要大量文件型 Agent 工作,或希望Telegram + 网页共用同一 Agent → 选 Hermes Agent + WebUI
  • 从 OpenClaw 迁移 → 运行 hermes claw migrate 后挂载 WebUI(见 Hermes 文档)。

前置条件

要求 说明
Docker Docker Desktop(Mac/Windows)或 Linux 引擎
磁盘 镜像约 2–5 GB;本地模型缓存需更多空间
API 密钥 Anthropic、OpenRouter,或 Nous Portal 一键配置
可选:Hermes CLI 若不用一体化镜像:curl -fsSL .../install.sh | bash

在 Apple Silicon Mac 上,绑定挂载应使用真实 UID(id -u——常为 501,而非 1000)。下文 Docker 示例显式设置 WANTED_UID / WANTED_GID

分步指南:Docker 安装(快速路径)

步骤 1 — 安装 Hermes Agent 配置(仅首次)

curl -fsSL https://raw.githubusercontent.com/NousResearch/hermes-agent/main/scripts/install.sh | bash source ~/.bashrc # 或 ~/.zshrc hermes setup # 向导:模型提供商 + API 密钥

若仅使用一体化 WebUI 镜像且已有 ~/.hermes,可跳过。

步骤 2 — 拉取 WebUI 镜像

docker pull ghcr.io/nesquena/hermes-webui:latest

国内从 ghcr.io 拉取镜像可能较慢,可配置镜像加速或使用代理后再执行 docker pull

步骤 3 — 运行单容器(官方一行命令)

docker run -d \ -e WANTED_UID=$(id -u) -e WANTED_GID=$(id -g) \ -v ~/.hermes:/home/hermeswebui/.hermes \ -e HERMES_WEBUI_STATE_DIR=/home/hermeswebui/.hermes/webui \ -v ~/workspace:/workspace \ -p 127.0.0.1:8787:8787 \ ghcr.io/nesquena/hermes-webui:latest

打开 http://localhost:8787

步骤 4 — 在 UI 或 CLI 中设置模型

hermes model # 例如 anthropic:claude-sonnet-4-6 或 openrouter 路由

WebUI 从挂载卷读取 ~/.hermes/config.yaml

步骤 5 — 安全远程访问(可选)

默认仅绑定本机127.0.0.1:8787)。若在 VPS 上部署:

# 在服务器:在 compose/.env 中设置 HERMES_WEBUI_PASSWORD,仅在反向代理后绑定 0.0.0.0 ssh -N -L 8787:127.0.0.1:8787 user@your-server

随后在本地浏览器访问 http://localhost:8787。若通过公网或跨境链路访问,注意出口带宽与延迟对流式聊天的影响。无头 Mac/Linux 的 SSH 基础可参考 Mac mini M4 SSH 远程连接教程

步骤 6 — Docker Compose(生产环境)

git clone https://github.com/nesquena/hermes-webui cd hermes-webui cp .env.docker.example .env # macOS 上按需修正 UID/GID docker compose up -d

仓库内 docs/docker.md 说明双容器(Agent + UI)部署与升级注意事项。

步骤 7 — Agent + UI 冒烟测试

在中间栏提问:「列出 workspace 中的文件并创建 hello.md。」 确认右侧栏更新,且出现 Shell/文件工具的工具卡片

架构:WebUI 如何与 Agent 通信

Browser (:8787)
    │
    ▼
Hermes WebUI (Node/React)
    │  WebSocket / HTTP API
    ▼
Hermes Agent process (tools, LLM, memory)
    │
    ├── ~/.hermes/          (config, sessions, skills)
    └── ~/workspace/        (project files → right column)

可对同一 ~/.hermes 状态运行 CLI(hermes网关(hermes gatewayWebUI——按设备选择界面。详见 架构文档

故障排除

docker run 后界面空白或「无法连接」

现象:浏览器访问 :8787 一直加载。

处理:查看容器日志(docker logs <id>),确认端口映射,确保 8787 未被占用。Linux 可试 curl -s http://127.0.0.1:8787

~/.hermes 挂载权限被拒绝

现象:Agent 已启动但配置缺失;模型列表为空。

处理:传入与主机 id -u / id -g 一致的 WANTED_UID / WANTED_GID。macOS 用户:在 compose 的 .env 中修改——默认假定 UID 1000。

WebUI 显示 Workspace 但 Agent 无响应

现象:聊天挂起,无流式输出。

处理:检查 ~/.hermes/config.yaml 中的 API 密钥,在主机运行 hermes doctor,核对提供商配额。先在终端用 hermes 测试 CLI。

未设密码就暴露端口

现象:为局域网访问将绑定改为 0.0.0.0:8787

处理:设置 HERMES_WEBUI_PASSWORD,并在前方部署带 TLS 的 nginx/Caddy。切勿将裸 :8787 暴露到公网。

国内拉取 ghcr.io 镜像很慢

现象:docker pull ghcr.io/nesquena/hermes-webui:latest 长时间无进度或频繁超时。

处理:在 Docker 守护进程或注册表镜像中配置镜像加速;必要时使用代理或先在网络较好的环境拉取再导出镜像。也可考虑 OpenRouter 等国内更易访问的 API 作为模型备选。

常见问题

Hermes WebUI 免费吗? +
界面与 Agent 均为开源(MIT)。你需要支付的是 LLM API 用量、电费和可能的 VPS 费用——而不是每月 20 美元的 Claude 订阅。
必须用 Claude API 才能有同款布局吗? +
不需要。三栏布局来自 Hermes WebUI模型可以是 Anthropic API 的 Claude,也可以是 GPT、Gemini、本地 Llama 等。
与 Open WebUI、LibreChat 有何不同? +
后者是通用聊天 UI。Hermes WebUI 专为 Hermes Agent 设计——原生工具卡片、Workspace 同步、hermes claw migrate,以及 Telegram/Discord 网关。若你需要 Nous Agent 闭环而非单纯聊天外壳,选 Hermes。
能在手机上用吗? +
可以——在浏览器访问你的服务器地址(需认证),或通过 SSH 端口转发 到本机 localhost。Hermes Gateway 也支持 Telegram,无需网页 UI 即可在移动端使用。
能完全替代 Claude Artifacts 吗? +
并非像素级一致。你会获得 Workspace 文件、预览与工具轨迹,并拥有 自托管控制权——取舍更偏向黑客与研究者,而非 polished 的 SaaS 体验。
用一个容器还是两个? +
试用时一个容器即可双容器 compose(Agent + UI)更适合升级与重负载工具任务——详见上游 docs/docker.md

Hermes WebUI 是 Agent 重度用户最接近 免费、自托管Claude 同款三栏工作区:历史、聊天与文件同屏——加上透明工具卡片,Docker 可在 8787 端口 几分钟内启动。

从官方 docker run 开始,挂载 ~/.hermes~/workspace,用 hermes setup 配置模型,再用真实写文件任务压测。官方仓库:nesquena/hermes-webui · NousResearch/hermes-agent

延伸阅读:技能沉淀与闭环学习见 Hermes 技能沉淀指南。多 Agent 路由见 OpenClaw 多智能体编排指南。无头主机远程 SSH 见 Mac mini M4 SSH 远程连接教程。有疑问请访问 帮助中心

继续查阅 Hermes 官方资源

Docker 运行手册、模型配置与架构说明见上游仓库。部署或升级 Hermes WebUI 时请与本指南对照使用。