Claude Code Viewer: 打造 Web 端 Claude Code 会话管理利器当 Claude Code 成为日常开发标配如何更高效地管理会话历史、分析对话流程就成了开发者的新需求。Claude Code Viewer 应运而生——一个功能完备的 Web 端 Claude Code 客户端。背景介绍Claude Code 是 Anthropic 推出的 AI 编程助手但其原生的会话管理能力相对基础。大多数开发者面临以下痛点会话历史难以追溯和检索无法在移动设备上方便地查看会话多人协作时难以共享会话内容缺乏对会话流程的全局视角Claude Code Viewer正是为解决这些问题而生的开源项目。它采用 Web 架构设计专注于会话日志的完整分析通过严格的数据校验和渐进式展示 UI让每一个对话细节都清晰可见。核心特性 会话日志查看Claude Code Viewer 直接读取 Claude Code 的标准日志格式~/.claude/projects/project/session-id.jsonl实时展示会话内容。支持历史日志浏览新会话会自动被发现。 全局搜索支持跨会话全文检索快捷键⌘K(macOS) /CtrlK(Linux) 即可唤起搜索框。功能包括模糊匹配前缀搜索键盘导航↑↓ 选择Enter 确认可选择特定项目或全局搜索 发起新会话直接在 Web 界面启动 Claude Code 会话享受完整的文件/命令补全、暂停/恢复、工具授权等功能体验。 继续会话独特的继续会话机制通过 Claude Code Viewer 启动的会话会保持存活状态除非手动终止无需重新加载 session-id 即可持续对话避免了传统 resume 方式的状态丢失。 项目管理创建新项目通过 Web UI 选择目录执行/init命令完成初始化项目列表集中管理所有 Claude Code 项目 文件上传与预览支持直接上传图片PNG、JPEG、GIF、WebP、PDF 和文本文件。每种文件类型都有专门的预览组件图片内联渲染PDF嵌入式查看器文本格式化内容展示 浏览器预览在聊天界面右侧嵌入可调整大小的浏览器面板预览任何 URL。支持URL 输入框 键盘导航刷新功能随导航自动调整聊天窗口宽度同源策略下的 URL 变化追踪⏰ 消息定时发送支持 cron 表达式设置周期性任务或指定具体时间执行一次性任务。特性包括并发控制跳过/执行定时任务自动删除速率限制自动继续检测到限流后自动安排 “continue” 消息 Git 集成内置 Git 功能让代码审查和提交流程完全在 Web 端完成Diff 查看器查看所有变更提交直接执行 Git 提交推送支持单独推送或提交推送一体化流程分支切换在 Git 面板中切换分支支持搜索和状态指示 侧边栏工具文件与工具检查器汇总编辑过的文件按项目分组列出工具调用并支持过滤和快速预览待办查看器提取会话中的TodoWrite项以可折叠清单形式展示终端面板底部 WebSocket 终端无需离开 UI 即可运行 Shell 命令MCP 服务器查看器查看 MCP 服务器配置支持实时重载⚙️ 系统信息监控 Claude Code 和 Claude Code Viewer 的版本、特性兼容性和系统状态。 多语言支持完整的国际化支持涵盖English日本語简体中文快速开始CLI 方式推荐直接运行无需安装npx kimuson/claude-code-viewerlatest--port3400或全局安装npminstall-gkimuson/claude-code-viewer claude-code-viewer--port3400服务启动后访问http://localhost:3400即可。命令行选项claude-code-viewer[options]Options: -p,--portport端口号(默认:3000)-h,--hostnamehostname主机名(默认: localhost)-P,--passwordpassword认证密码 -e,--executableexecutableClaude Code 可执行文件路径 --claude-dirclaude-dirClaude 目录路径 --api-only API 纯响应模式无 Web UIDocker 部署构建镜像dockerbuild-tclaude-code-viewer.运行容器dockerrun--rm-p3400:3400\-ePORT3400\-eCCV_PASSWORDyour-password\claude-code-viewer或使用 Docker Composedockercompose up--build⚠️ 注意默认的 docker-compose.yml 没有挂载claude_home。如需复用本地 Claude 工作区需配置 volume 映射services:app:volumes:-/path/to/claude_home:/root/.claude与官方方案的对比官方 Web 版 Claude CodeAnthropic 官方提供 Claude Code on the Web在云端虚拟机中运行会话。适合使用官方方案的场景快速测试无需本地配置移动设备或公共电脑临时使用单一的 CLAUDE.md 根目录项目适合使用 Claude Code Viewer 的场景需要使用预配置本地环境数据库、服务、大型依赖Monorepo 项目多个目录各有 CLAUDE.md开发需要大量计算资源或长时间运行进程偏好自托管对开发环境有完全控制需求社区其他 Web 客户端社区也涌现了不少优秀的 Web 客户端如 sugyan/claude-code-webuisupport、wbopan/cui、siteboon/claudecodeui 等。Claude Code Viewer 的差异化优势特性说明零信息丢失Zod 严格校验确保每个对话细节都被保留渐进式展示可展开元素和子会话弹窗管理信息密度内置 Git 操作完整 Diff 查看器支持直接提交会话流程分析跨多会话的完整对话追踪系统监控实时版本和特性兼容性监控国际无障碍多语言支持远程开发支持Claude Code Viewer 从设计之初就考虑了远程托管场景移动端优化 UI响应式设计专用移动端侧边栏触控优化内置 Git 操作直接在 Web 界面审查和提交代码实时通知任务完成时音频提醒系统监控跨环境监控 Claude Code 兼容性基础密码认证可通过--password或CCV_PASSWORD环境变量启用。如需更复杂的认证方案建议在基础设施层面实现如反向代理 OAuth、VPN、IP 白名单。系统要求Node.js: 20.19.0操作系统: macOS / Linux不支持 WindowsClaude Code: v1.0.50工具授权功能: 需要 v1.0.82总结Claude Code Viewer 为开发者提供了一个强大且灵活的 Web 端会话管理解决方案。无论你是需要回溯历史会话进行代码审查在移动设备上查看开发进度团队共享会话协作远程开发工作Claude Code Viewer 都能满足你的需求。其开源免费、特性丰富且持续活跃维护值得一试。项目地址: https://github.com/d-kimuson/claude-code-viewer