1. 项目定位与用途
Claude Code Web 是一个基于 Nuxt 4 构建的浏览器端 Web 界面,专为 Anthropic 的 Claude Code CLI 提供图形化前端。它允许用户通过浏览器与 Claude Code 进行实时交互,同时集成了语音输入、文本转语音、拖放图片、热键和内置待办事项侧边栏等增强功能,采用移动优先的 PWA 设计,旨在提升开发者的代码辅助体验和工作效率。项目可通过 npm 全局安装,快速部署运行。
Claude Code Web 是一个为 Anthropic Claude Code CLI 设计的浏览器 Web 界面,提供实时聊天、语音交互、图像拖放和待办事项管理等功能。本文介绍其安装步骤、使用方法、配置选项及安全注意事项,帮助开发者快速在浏览器中使用 Claude Code。
Claude Code Web 是一个基于 Nuxt 4 构建的浏览器端 Web 界面,为 Anthropic 的 Claude Code CLI 提供图形化操作环境,集成语音交互、图像拖放和任务管理等功能,提升开发者使用 Claude Code 的效率和体验。
Claude Code Web 是一个基于 Nuxt 4 构建的浏览器端 Web 界面,专为 Anthropic 的 Claude Code CLI 提供图形化前端。它允许用户通过浏览器与 Claude Code 进行实时交互,同时集成了语音输入、文本转语音、拖放图片、热键和内置待办事项侧边栏等增强功能,采用移动优先的 PWA 设计,旨在提升开发者的代码辅助体验和工作效率。项目可通过 npm 全局安装,快速部署运行。
Claude Code CLI 作为命令行工具,使用门槛较高且交互方式有限。Claude Code Web 通过提供直观的 Web 界面,降低了操作复杂度,并解决了命令行无法直接支持语音、图像等多模态输入的问题。此外,内置的待办事项侧边栏帮助用户管理开发任务,使 Claude Code 更融入日常开发流程,从而提升整体开发效率。
该项目适用于希望在浏览器中使用 Claude Code 的开发者,特别是那些不熟悉命令行操作或偏好图形界面的用户。典型场景包括:进行实时代码辅助对话、通过语音输入快速提问、拖放图片讨论视觉错误、使用热键加速操作、以及通过待办事项侧边栏跟踪开发任务。得益于 PWA 设计,也适合需要移动端访问的场景。
安装 Claude Code Web 需要先确保系统已安装 Node.js 18 或更高版本,并已设置好 Claude Code CLI。然后通过 npm 全局安装包:运行命令 `npm install -g @sunpix/claude-code-web`。安装完成后,即可使用 `claude-code-web` 命令启动服务。注意,安装过程依赖于 npm 和 Node.js 环境,具体版本要求已在 README 中明确。
启动服务后,在浏览器中访问 `http://localhost:3000` 即可使用 Web 界面。默认情况下,服务运行在 3000 端口,但可通过环境变量修改:`PORT=8080 claude-code-web` 更改端口。若需在反向代理下从子路径服务,使用 `APP_BASE_URL=/claude-code claude-code-web`。要启用 Whisper 麦克风支持进行语音输入,需设置 OpenAI API 密钥:`OPENAI_API_KEY=sk_... claude-code-web`。所有配置均通过环境变量实现,无需修改代码。
项目采用移动优先的 PWA 设计,支持离线缓存和移动端适配。重要安全提示:Claude Code Web 无任何认证机制,任何能访问运行端口的用户均可控制主机环境,因此强烈建议在防火墙或认证代理后运行。此外,语音输入功能依赖 OpenAI 的 Whisper API,需自行申请 API 密钥。项目基于 Nuxt 4 框架开发,确保现代前端性能和开发体验。仓库中未明确给出其他高级自定义或插件机制。
需要先安装 Node.js 18+ 和 Claude Code CLI,然后运行 npm install -g @sunpix/claude-code-web 进行全局安装。
安装后,在终端执行 claude-code-web 命令即可启动服务,默认监听 http://localhost:3000。
通过设置 PORT 环境变量,例如 PORT=8080 claude-code-web 可将服务运行在 8080 端口。
需要 OpenAI API 密钥,运行 OPENAI_API_KEY=sk_... claude-code-web 来启用 Whisper 麦克风支持。
仓库中未明确给出认证机制,README 警告称无认证,任何访问端口者可控制环境,建议在防火墙或认证代理后运行。