本文是「Agent 不下班」系列的手机方案升级篇。基础架构怎么搭,见 Agent 不下班:随时随地随设备的开发体系;多 Agent 怎么调度,见 将军赶路不追小兔。这篇聊的是:整套体系切换到 Herdr 之后,手机端的开发体验怎么跟着升级。
还是那句话——作为人类,你只需要读懂架构思路和选型逻辑。具体的安装部署,丢给你的 Agent 去执行就行。
起因:断连之后的空虚
今天真是悲惨的一天。下午 Codex 用了四年的老账号突然被封了,莫名其妙,没有任何逆向也没有反代,正常使用。好不容易收拾好心情,晚上回到家发现远程开发机断连了。
平时回到家之后,都是打开手机继续和 Agent 协作——审一下主脑的方案、批几个任务卡、看看执行层的进度。和它们断连以后,一下子觉得特别空虚,健身完了也不知道该干嘛。
干脆就来写这篇文章吧。之前一直想写但没动笔——最近整个体系已经从 tmux 切换到了 Herdr,手机端的方案也跟着做了一次大升级。HerdWeb 其实已经开发完成并且用了一段时间了,正好趁这个空档把思路整理出来。
一、1.0 方案的两道裂缝
在 Agent 不下班 那篇文章里,我推荐的手机方案是 HAPI + tmux,网络走 Tailscale 或 Cloudflare Tunnel。用了一段时间之后,出现了两个越来越明显的问题。
裂缝一:tmux 的状态盲区
在 多 Agent 调度 那篇里我提过,我现在的调度思路是主脑派任务卡——主脑负责规划和拆任务,执行层在后台自主执行。
这个模式下,tmux 的标题(title)机制就不够用了。两种场景特别痛:
- 主脑已经干完了,但 tmux 标题没变。 你不知道它在等你,任务就一直卡着没往下推进。
- tmux 标题变了,但后台执行层还在跑。 你点进去一看,其实什么都不需要做。白白浪费注意力。
同时开五六个主脑的时候,这两种情况反复出现。你的精力被大量消耗在"判断谁需要我关注"上——而不是关注本身。
裂缝二:HAPI 的两个硬伤
HAPI 本身做得不错,但有两个问题让我最终放弃了它:
第一,多了一层渲染。 HAPI 把 Agent 的终端界面重新渲染成网页。这个过程中,有些原生 Coding Agent 的命令和交互它没法完全支持。从电脑切到手机的时候,总能感觉到一个明显的"翻译层"在中间。
第二,跨会话消息接管。 HAPI 最近更新了一个功能——不同 Agent 会话之间可以互相沟通。这个功能可能有它的使用场景,但问题是没办法关闭。结果就是我在本地开发的时候,正和一个 Agent 聊着,对话突然被另一个 Agent 的消息"劫持"了。体验非常差。
这两道裂缝加在一起,是时候找一个更好的方案了。
二、换将:从 tmux 到 Herdr
Herdr 是什么
如果你读过上一篇文章,已经知道 tmux 是一个"后台不掉线的虚拟桌面"——Agent 跑在 tmux 里,SSH 断了它照样在后台执行。
Herdr 做的是同样的事情,但它是 tmux 的下一代。 名字来自 Herd(牧群)加一个 R——意思是"放牧你的终端会话"。它是近期热门的开源项目,专门为管理多个 CLI 客户端设计。
它和 tmux 的核心区别,用大白话说就两点:
① 鼠标优先。 tmux 的操作全靠键盘快捷键,学习曲线陡。Herdr 可以直接点击窗格、拖动边框、右键菜单分屏——跟你平时用软件的方式一样。这一点在 Agent 时代其实不太重要(Agent 自己会用命令操作),但人类偶尔手动操作时是加分项。
② 角标 API 可编程。 这才是我切换的核心原因。Herdr 的窗格角标——就是每个窗口旁边的小标签——可以通过脚本自由编辑。
角标解决了什么问题
还记得上面说的 tmux 状态盲区吗?切换到 Herdr 之后,这个问题就完全不存在了。
我写了一个监控脚本,实时检测每个主脑和后台任务的状态,然后通过 Herdr 的角标 API 更新显示。效果就是——扫一眼角标,就知道哪个主脑在等我、哪个执行层还在跑、哪个任务已经完成了。
精力终于可以花在"做决策"上,而不是"判断谁需要我"上。

之前在 tmux 里,这个问题没办法方便地解决。切换到 Herdr 之后,体验是质变级别的提升。
Herdr 还有一个隐藏优势
Herdr 天然支持 Web UI 渲染——它不介意你是通过电脑配鼠标键盘、还是通过网页来访问。不同尺寸的屏幕上,Herdr 都有对应的适配方案。
这个特性,直接为后面的手机方案铺好了路。
三、手机方案选型:Moshi 还是 Web
底层从 tmux 切到 Herdr 之后,手机端的方案自然也要跟着换。
Moshi:做得精美,但不适合我
最先注意到的是一个叫 Moshi 的原生手机 APP。群里有朋友推荐,我看了一下确实做得精美——专门为远程操控 Agent 设计,支持 tmux 和 Herdr,UI 很漂亮,甚至有 Apple Watch 配套和语音输入。
但有两个问题让我放弃了:
第一,没有内嵌 Tailscale 支持。 手机上同时只能跑一个 VPN。Moshi 本身不内嵌 Tailscale,你得单独开 Tailscale VPN 才能连回家里的服务器。问题是一旦开了 Tailscale,手机上其他需要网络工具的软件就没法同时用了。日常使用中,这个冲突非常烦人。
第二,价格。 一年三台设备授权将近 500 块,而且我自己设备特别多。
一个自然的联想
既然 HAPI 本质上就是一个基于 Web 的方案,而 Herdr 又天然支持 Web 渲染——那能不能直接基于 Web 来做 Herdr 的手机体验?
Web 方案的好处是:手机上用浏览器打开就行,不需要安装原生 APP,也不需要单独开 VPN(通过 Cloudflare Tunnel 走 HTTPS 就可以)。
去 GitHub 上搜了一下,确实有人造好了轮子——一个叫 remobi 的开源项目,支持把 Herdr、tmux、Zellij 的会话通过网页暴露出来。
试用之后发现,Herdr 已经把最难的 Web UI 渲染问题解决了。 remobi 只需要负责建立 WebSocket 连接和前端交互——渲染本身交给 Herdr 处理。
但原始项目在手机上的体验比较粗糙。所以我 fork 了下来,做了一轮比较大的重构升级,改名为 HerdWeb。
四、HerdWeb:七项手机优化
所有优化都围绕一个核心矛盾:手机屏幕寸土寸金。
每一寸显示面积都是宝贵的。你希望看 Agent 输出的时候信息尽可能多、操作的时候尽可能顺手。所有设计决策都从这个约束出发。

① 键盘控制:该出现时出现,该消失时消失
手机上你经常需要上下滑动查看 Agent 的输出。问题是——Agent 的终端有输入焦点,一碰屏幕软键盘就弹出来,瞬间遮掉半个屏幕。
HerdWeb 做了一个全局键盘开关。禁用状态下可以自由滑动浏览,完全不会误触弹出键盘;要输入的时候一键启用。
听起来简单,但在手机上这是体验质变的关键——屏幕能完整展示的信息量直接翻倍。
② 语音输入:不弹键盘也能打字
既然软键盘占屏幕空间,那干脆少用键盘。HerdWeb 内嵌了语音输入功能,目前接的是火山引擎的语音识别服务(和豆包输入法同款技术)。
其实现在很多人已经习惯了用豆包输入法的语音功能在手机上打字,体验确实很好。但问题是——你得先唤起软键盘,才能点那个语音按钮。键盘一弹出来,屏幕空间又少了一大块。
HerdWeb 内嵌的语音输入绕开了这一步:不需要弹出软键盘,直接点语音按钮就能说话输入。 识别准确率可能没有豆包输入法那么高,但能在不占用屏幕空间的前提下完成输入,这个取舍对手机场景来说是值得的。
③ 键位布局:一级菜单放什么
手机底部的操作栏空间有限,必须想清楚哪些操作放一级菜单(一眼看到、一键触达),哪些折叠到二级菜单。
我从自己的实际使用频率出发,一级菜单放了八个:
ESC · Ctrl+C · 回车 · 删除 · 键盘开关 · 图片粘贴 · 语音输入 · 更多菜单
这几个覆盖了日常和 Coding Agent 交互的绝大多数场景:ESC 取消、Ctrl+C 中断、回车确认、删除修改,加上前面提到的键盘开关、图片粘贴和语音输入。剩下不那么常用的操作放进"更多"里,需要的时候展开。
④ 图片粘贴:补上瘸掉的那条腿
原始的 remobi 项目不支持图片粘贴。
在 Coding Agent 时代,截图发给 Agent 分析是一个非常高频的操作——前端页面有 Bug,截个图给 Agent 一看就明白了。不支持图片粘贴,基本上瘸了一条腿。HerdWeb 把这个能力补上了。
⑤ 通知:别错过 Agent 的消息
HerdWeb 是一个 PWA(上篇文章解释过,就是把网页"安装"到手机桌面上,打开后看起来像原生 APP 的技术)。PWA 自带系统通知注册能力,Agent 有消息的时候会推送到手机通知栏。
同时支持外部 Hook——可以把通知转发到企业微信等第三方平台。即使你没开着 HerdWeb 页面,也不会错过重要的 Agent 消息。
⑥ 多设备多服务器
如果你有多台开发机都装了 Herdr(比如我同时有 Mac Studio 和 Linux 主机),HerdWeb 可以在同一个页面里管理所有服务器上的所有会话。切换就像切标签页一样方便,不需要来回登录不同的地址。
⑦ 弱网优化:从 Mosh 协议学来的
高铁上、地下室里、信号不好的地方,网络会频繁断续。普通的 WebSocket 连接一断就得重连,中间的输入可能丢失、画面可能和服务器不同步。
HerdWeb 从 Mosh 协议(一个专门为不稳定网络设计的远程终端协议)里吸收了不少思路,主要解决两个问题:
- 数据一致性:断连时画面标记为"过期",重连后自动拉取最新快照刷新——确保你看到的永远是服务器的真实状态,不会出现"我以为 Agent 还在跑,其实早停了"的情况。
- 输入不丢失:弱网期间你按的键会缓冲起来,重连后自动发送,不需要重新敲一遍。
这两点在高铁上的体验提升特别明显。
五、鉴权:不做什么也很重要
HerdWeb 没有内建鉴权层。这不是偷懒,是刻意的设计决策。
它本质上是一个个人部署的工具,鉴权这件事应该交给更专业、更成熟的基础设施来处理——就像上一篇文章里介绍过的 Tailscale 或 Cloudflare Tunnel + Access。
但请务必记住:千万不要把 HerdWeb 直接暴露在公网上。 谁能访问这个页面,谁就能驱动你服务器上的终端——相当于直接拿到了你开发机的命令行权限。一定要套一层 Tailscale 内网或者 Cloudflare Access 鉴权。
好消息是,这块的配置方式和 1.0 文章里写的完全一样。如果你已经按照上篇文章配好了网络层,换成 HerdWeb 只需要改一下 Cloudflare Tunnel 指向的端口就行了。
六、2.0 架构全景
把 1.0 和 2.0 的变化放在一起看,变化只集中在会话管理层:
1.0 体系 2.0 体系
───────────────────────────────────────
tmux(后台会话管理) → Herdr(角标可编程 + Web 渲染)
HAPI(手机遥控器) → HerdWeb(语音输入 + 弱网优化 + 七项手机适配)
───────────────────────────────────────
服务端(Mac / Linux) 不变
网络层(Tailscale / CF) 不变
客户端设备 不变
服务端、网络层、客户端设备——全都不需要动。这也是上篇文章里分层架构的好处:换掉中间一层,上下两层无感。
如果你之前已经搭好了 1.0 的体系,升级到 2.0 的工作量非常小:装 Herdr,部署 HerdWeb,改一下 Tunnel 端口。整个迁移让 Agent 来做,大概十几分钟的事情。
七、最终效果
基于 HerdWeb,之前「Agent 不下班」里描述的"随时随地随设备"的体验全部保留,而且手机端的操作体验有了质的提升:
- 安卓、iOS——PWA 安装到桌面,打开就用
- 电脑——Chrome 浏览器一个 URL 搞定
- 弱网场景——高铁、地下室,输入不丢、画面自动恢复
- 语音驱动——躺在床上对着手机说话,就能给 Agent 下指令
我自己目前日常就用它做手机端的远程开发,基本上是满意的。只要远程开发机在线,你在床上、在高铁上、在海外,随时都可以和 Agent 建立联系。
代码全部开源。不懂的话,直接把 HerdWeb 仓库拉下来,让你的 Agent 给你讲解。
附录:给 Agent 的参考资料
以下内容面向 Coding Agent。人类读者可以跳过——把这篇文章的链接发给你的 Agent,它会自己来读。
核心组件
| 组件 | 文档 | 说明 |
|---|---|---|
| Herdr | 官方文档 | 终端多路复用器,替代 tmux。herdr 启动,herdr --session <name> 创建命名会话。支持角标 API 和 Web UI |
| HerdWeb | GitHub | Herdr 的 Web 遥控器,fork 自 remobi。需要 Node.js ≥ 22 |
| Moshi | 官方文档 | 原生手机终端 APP(付费),支持 Mosh 协议、tmux、Herdr。本文未选用但可作为备选 |
从 1.0 迁移的关键步骤
| 步骤 | 操作 | 说明 |
|---|---|---|
| 1. 安装 Herdr | 参考 官方文档 | macOS 和 Linux 均支持;确认版本 ≥ 0.8 |
| 2. 部署 HerdWeb | git clone https://github.com/zlxlabs/herdweb && cd herdweb && pnpm install | 需要 Node.js ≥ 22;pnpm exec tsx cli.ts serve 启动,默认监听 127.0.0.1:7681 |
| 3. 配置网络 | 把 Tailscale API Key 和/或 Cloudflare API Key 交给 Agent,让它帮你配 | 两条路二选一或者都配,详见下方网络方案对比 |
网络方案对比
语音输入功能需要 HTTPS 安全上下文,两条网络路线都满足这个要求:
| 方案 | 优势 | 注意事项 |
|---|---|---|
| Tailscale | 异地组网,天然安全——只有你自己的设备能访问,不暴露公网 | 手机上需要安装 Tailscale APP 并保持 VPN 开启,可能与其他 VPN 冲突 |
| Cloudflare Tunnel + Access | 手机上无需安装任何额外软件,浏览器直接访问域名即可 | 必须配置 Access 策略做鉴权(邮箱验证等),否则等于把终端权限暴露在公网上,非常危险 |
建议把对应的 API Key 给到你的 Agent,告诉它你想走哪条路线(或者两条都配),让它帮你一条龙搞定。配完之后记得撤销或轮换 API Key。
HerdWeb 功能配置
| 功能 | 配置要点 |
|---|---|
| 语音输入 | 需要 HTTPS 安全上下文(Cloudflare Tunnel 自带);配置火山引擎 API Key |
| PWA 通知 | 首次打开页面时允许通知权限;支持 Web Push |
| 外部 Hook | 可配置 Webhook URL,转发通知到企业微信等平台 |
| 多服务器 | 在 HerdWeb 配置中添加多个 Herdr 服务器地址 |
弱网优化机制(参考 Mosh 协议)
- 连接断开时标记屏幕状态为 stale,阻止回放过时数据
- 重连后拉取最新快照(snapshot)刷新,保证数据一致性
- 输入缓冲:弱网期间的按键操作不丢失,重连后自动发送
安全提醒
- HerdWeb 没有内建鉴权,默认仅绑定
127.0.0.1 - 必须通过 Tailscale 内网或 Cloudflare Tunnel + Access 暴露
- 禁止直接开放公网访问——任何能访问该页面的人都可以驱动你的终端
- 鉴权配置方式与 Agent 不下班 1.0 中的网络层完全相同
本文由飞书录音豆语音转文字构思底稿,通过 Claude Code + Opus 4.6 对话完成文章架构设计与内容整理。