> ## Documentation Index
> Fetch the complete documentation index at: https://cc.cyber101.cc/llms.txt
> Use this file to discover all available pages before exploring further.

# CUI: Claude Code Web UI 

> 一个现代化的 Claude Code 代理 Web UI，允许您在任何浏览器中访问 Claude Code，支持并行后台代理和任务管理。

> **⭐ GitHub**: [wbopan/cui](https://github.com/wbopan/cui) (455 stars)
> 一个现代化的 Claude Code 代理 Web UI。启动服务器，在浏览器中访问 Claude Code。

## [亮点](#亮点)

* **现代设计**: 精美的响应式 UI，可在任何地方工作
* **并行后台代理**: 同时流式处理多个会话
* **任务管理**: 访问所有对话并分支/恢复/归档它们
* **Claude Code 兼容性**: 熟悉的自动完成和 CLI 交互
* **推送通知**: 当代理完成时获得通知
* **语音听写**: 由 Gemini 2.5 Flash 提供精确的语音听写

## [开始使用](#开始使用)

1. 确保您已登录 Claude Code 或拥有有效的 Anthropic API 密钥。
2. 使用 Node.js >= 20.19.0，启动服务器：
   ```
   npx cui-server
   ```
   或全局安装：
   ```
   npm install -g cui-server
   ```
3. 在浏览器中打开 `http://localhost:3001/#your-token`（令牌将显示在 cui-server 命令输出中）。
4. （可选）配置通知和听写设置。

## [使用方法](#使用方法)

### [任务](#任务)

* **启动新任务**\
  cui 自动扫描 `~/.claude/` 中现有的 Claude Code 历史记录并在主页上显示，允许您恢复任何之前的任务。输入区域的下拉菜单显示所有之前的工作目录。
* **分支任务**\
  要从现有任务创建分支（仅支持从 cui 启动的任务），导航到主页的"历史"选项卡，找到要分支的会话，并使用新消息恢复它。
* **管理任务**\
  启动任务后可以随意关闭页面——它将在后台继续运行。运行多个任务时（从 cui 启动），您可以在"任务"选项卡中检查其状态。您也可以通过点击"归档"按钮来归档任务。归档的任务在"已归档"选项卡中仍然可访问。

### [语音听写](#语音听写)

cui 使用 Gemini 2.5 Flash 提供高度准确的语音听写，对长句子特别有效。要启用此功能，您需要具有慷慨免费层使用量的 Gemini API 密钥。在启动服务器之前设置 `GOOGLE_API_KEY` 环境变量。请注意，使用此功能将与 Google 共享您的音频数据。

### [通知](#通知)

当任务完成或 Claude 等待您允许使用工具时，您可以接收推送通知。通知使用 ntfy 发送。要接收它们，在任何设备上安装 ntfy 并订阅主题（请参阅设置）。

### [键盘快捷键](#键盘快捷键)

更多键盘快捷键即将推出。目前可用：

* `Enter`: 输入新行
* `Command/Ctrl + Enter`: 发送消息
* `/`: 列出所有命令
* `@`: 列出当前工作目录中的所有文件
  所有内联语法如 `/init` 或 `@file.txt` 都像在 CLI 中一样受支持。

### [远程访问](#远程访问)

1. 打开 `~/.cui/config.json` 设置 `server.host` (0.0.0.0) 和 `server.port`。或者，您可以在启动服务器时使用 `--host` 和 `--port` 标志。
2. 如果从本地网络外部访问服务器，请确保使用安全身份验证令牌。身份验证令牌在启动服务器时生成，可以在 `~/.cui/config.json` 文件中更改。
3. 推荐：使用 HTTPS 访问服务器。您可以使用反向代理如 Caddy 来设置。在 iOS 上，听写功能仅在您使用 HTTPS 时可用。

### [配置](#配置)

所有配置和数据都存储在 `~/.cui/` 中。

* `config.json` - 服务器设置
* `session-info.json` - 会话元数据
* `preferences.json` - 用户偏好
  要卸载 cui，只需删除 `~/.cui/` 目录并使用 `npm uninstall -g cui-server` 删除包。

## [主要功能](#主要功能)

### [基于 Web 的界面](#基于-web-的界面)

* **浏览器访问**: 从任何带有 Web 浏览器的设备访问 Claude Code
* **响应式设计**: 在桌面、平板和移动设备上无缝工作
* **现代 UI**: 符合现代 Web 标准的干净直观界面

### [多会话管理](#多会话管理)

* **并行处理**: 同时运行多个 Claude Code 会话
* **后台执行**: 即使关闭浏览器，任务也会继续运行
* **会话历史**: 自动扫描并显示您现有的 Claude Code 历史记录

### [高级功能](#高级功能)

* **语音听写**: 由 Gemini 2.5 Flash 提供准确的语音转文本
* **推送通知**: 任务完成或需要关注时的实时提醒
* **远程访问**: 通过适当配置从任何地方安全访问

### [CLI 兼容性](#cli-兼容性)

* **熟悉命令**: 所有 CLI 命令和快捷键在 Web 界面中工作
* **文件操作**: 完全支持文件浏览和操作
* **工具集成**: 完全访问所有 Claude Code 工具和功能

## [使用场景](#使用场景)

### [对于开发者](#对于开发者)

* **远程开发**: 从任何设备或位置访问 Claude Code
* **团队协作**: 与团队成员共享会话和协作
* **移动开发**: 在平板和移动设备上使用 Claude Code

### [对于团队](#对于团队)

* **集中访问**: 为团队成员提供基于 Web 的 Claude Code 访问
* **会话共享**: 轻松共享和恢复协作会话
* **监控**: 跟踪团队使用情况和会话活动

### [对于组织](#对于组织)

* **企业部署**: 在内部服务器上部署 CUI 以安全访问
* **用户管理**: 通过配置控制访问和权限
* **集成**: 与现有开发工作流程和工具集成

## [技术要求](#技术要求)

* **Node.js**: >= 20.19.0
* **Claude Code**: 必须安装和配置
* **网络访问**: 用于远程访问和通知
* **可选**: 用于听写功能的 Gemini API 密钥

***

## [来源和致谢](#来源和致谢)

本文基于 [wbopan/cui](https://github.com/wbopan/cui) GitHub 仓库整理而成。
**原作者**: wbopan\
**原始链接**: [https://github.com/wbopan/cui](https://github.com/wbopan/cui)\
**许可证**: Apache-2.0 License
感谢 wbopan 创建了这个优秀的 Claude Code Web UI，为 AI 辅助开发提供了现代化的浏览器界面和强大的多会话管理能力。

* [Context Engineering 模板：让 AI 编码助手真正落地的系统方法](/docs/tools/context-engineering) - 基于 coleam00/context-engineering-intro 的上下文工程模板与实践，涵盖 INITIAL/PRP 工作流、示例库与最佳实践
* [Happy：Claude Code 的移动端和网页客户端](/docs/tools/happy-mobile-client) - 一个全面的移动端和网页客户端，为您的手机带来具备端到端加密、语音控制和多会话支持的 Claude Code。让您在任何地方都能使用 Claude Code，无需改变工作流程。
