Claude Code cli 可视化(web端和桌面端)

先说说我自己用 Claude Code 时一直很烦的几个地方。

一是命令行能看到的东西太少。 它干活的时候,读了哪些文件、跑了什么命令、改了哪几行,全在终端里刷过去。想回头看某一步改了啥,只能往上翻,翻半天还不一定找得到。看 diff 也不方便,基本还得再开个编辑器或者 git 工具。

二是 Claude Desktop 接中转很麻烦。 想用中转,折腾半天只能装虚拟机之类的绕过去,而且不少功能用不了,体验很割裂。

三是切模型要靠 cc-switch。 想换个中转,或者试试 DeepSeek、Kimi,就得去 cc-switch 切一下。切完所有对话一起变,想让两个任务分别用不同的模型根本做不到。

被这几个问题烦久了,干脆自己写了一个网页版,用了一段时间挺顺手,就开源出来了:

下面说说它有什么值得用的地方。

模型和中转

  • 供应商可以一次加好几个:中转、DeepSeek、Kimi、智谱、通义、硅基流动、OpenRouter、Gemini 都行。选个来源,粘上 Key,点连接就好。模型列表和接口格式它自己会去判断,测试通过了才保存;Key 填错、余额不够、地址不对,它也会直接告诉你是哪里的问题。
  • 对话聊到一半想换模型,输入框旁边点一下就换,前面的记录都在,接着聊就行。
  • 不同对话可以各用各的:这边用 Claude 中转写代码,那边丢给 DeepSeek 干点杂活,同时跑互不影响。
  • 不会改你的 ~/.claude/settings.json,原来命令行怎么用还怎么用。
  • 开着梯子的话可以设成跟随系统代理,不用自己去配环境变量。


看得清它在干嘛

  • 每一轮做了什么,会折成一行摘要,比如「读了 2 个文件 · 改了 2 个 · 运行 1 条命令」,想看细节就点开一步步看。
  • 改了哪些文件,在回答下面列成卡片,点一下右边就出 diff。
  • 右边有审阅面板,可以直接暂存、还原、写提交说明提交,不用切出去开 git 工具。
  • 要它批准权限的时候,会弹一张卡片在输入框上面,写清楚它想跑什么命令,允许还是拒绝点一下就行。
  • 文件树、全文搜索、终端都在右边,基本不用离开这个页面。

不只是 Claude

  • Codex、Gemini CLI、Qwen、Kimi、OpenCode 也能接进来,在同一个界面里用。
  • 一个对话可以交给另一个 Agent 接着干,比如 Claude 写到一半,让 Codex 来 review。
  • Codex、OpenCode 以前的对话也能列进来,支持中文全文搜索,找以前聊过的东西方便很多。

让它自己干活

  • 定时任务:比如工作日早上 9 点检查依赖更新、每晚跑一遍测试并汇报。自带几个模板,点一下就能用。
  • 目标模式:给它一个目标,它会自己一轮一轮做下去,直到做完或者卡住了才停。
  • 多 Agent 编排:几个 Agent 在各自独立的副本里同时干同一件事,最后你挑一个最好的合并进来。

手机和群聊

  • 手机扫码配对就能用,躺床上也能看任务跑完没、点一下批准权限。
  • 可以接 Telegram、Discord、Slack、钉钉、飞书机器人,在群里给它发任务。

省钱

  • 针对中转做了提示缓存的优化,用量面板里能看到每个模型的缓存命中率和花了多少。
  • 可以把几个中转组成一组,一个挂了或者被限流了,自动切到下一个。

怎么装

建议直接跑源码,更新的时候 git pull 一下就行。需要 Node 22 以上:

git clone https://github.com/ypyik0669/claude-web.git
cd claude-web && npm install && npm run build && npm start

然后浏览器打开 http://127.0.0.1:3090。

懒得弄的话,Releases 里也有 Windows 和 Mac 的安装包,装完以后有新版本会自己提醒。

一个人写的,肯定还有不少 bug,有问题直接回帖或者去提 issue。觉得好用的话给个 star 呗

4 个赞

? 这项目工程量很大啊? 佬就顺手做了?

还有今天杀了一波号,佬的居然没事。。。 羡慕了。

1 个赞

感觉还有一点点bug 一周弄出来了 还在稍微调试哈哈哈哈

我可是正经歪果仁~

好东西

1 个赞

刚需啊 解决了痛点!!

1 个赞