Skip to content

LimLLL/codex-webui

Repository files navigation

Codex WebUI

GHCR Docker

OpenAI Codex CLI 做的 Web 前端。把命令行交互搬到浏览器里,支持多线程并发、文件管理、终端、插件市场等。

后端用 NestJS 通过 stdio JSON-RPC 和 codex app-server 通信,前端 React + Vite,中间用 Socket.IO 实时推送。

English

主界面

功能

对话与线程

  • 多线程并发运行,互不干扰
  • 线程按工作区分组,支持归档、fork、回滚、重命名
  • Markdown 渲染 + Shiki 代码高亮
  • @ 引用文件、粘贴图片
  • 追问(steer)和中断(stop)正在执行的 turn

审批流程

  • 命令执行、文件变更的审批卡片,直接在页面上操作
  • 支持安全策略切换(sandbox 级别)
  • 多设备同时在线时的 CAS 防冲突

文件管理

文件管理

  • 树形文件浏览器,支持拖拽移动
  • Monaco Editor 代码查看
  • Git diff 分栏对比(@git-diff-view)
  • 上传 / 下载 / 重命名 / 复制 / 移动 / 新建目录

终端

终端

  • 多 tab 共享终端(node-pty + xterm.js)
  • 断线重连,输出不丢失
  • headless VT 回放

集成与插件

集成

其他

  • JWT + API Key 认证
  • 插件/MCP 服务器管理
  • 深色/浅色主题,中英文切换
  • 响应式布局,手机平板也能用
  • Docker 一键部署

技术栈

浏览器
  React 19 · Vite 8 · TanStack (Router + Query + Virtual)
  Zustand · Socket.IO Client · Monaco Editor · xterm.js
  Tailwind CSS 4 · shadcn/ui · Framer Motion · dnd-kit
     ↕  REST + WebSocket
后端
  NestJS 11 · Fastify 5 · Socket.IO · node-pty
  SQLite (better-sqlite3 + Drizzle ORM) · Pino
     ↕  stdio JSON-RPC
  codex app-server(子进程)

快速开始

前置条件

  • Node.js >= 20
  • pnpm >= 9
  • Codex CLI 已安装并可用

Docker 部署(推荐)

直接从 GHCR 拉取镜像,无需本地构建:

# 创建 .env
cat <<EOF > .env
WEBUI_API_KEY=your-secret-key
OPENAI_API_KEY=sk-xxx
EOF

# 启动(自动拉取多架构镜像)
docker compose up -d

或者手动运行:

docker run -d --name codex-webui \
  -p 8172:8172 \
  -e WEBUI_API_KEY=your-secret-key \
  -e OPENAI_API_KEY=sk-xxx \
  -v codex_root:/root \
  -v codex_workspaces:/workspaces \
  ghcr.io/limlll/codex-webui:latest

服务运行在 http://localhost:8172

/root 卷持久化 codex/claude/MCP 配置及运行时工具链。首次启动自动释放内置 seed。

本地开发

git clone https://github.com/LimLLL/codex-webui.git
cd codex-webui
pnpm install

cp .env.example .env
# 编辑 .env,至少设置 WEBUI_API_KEY

# 启动后端(默认端口 8172)
pnpm start:dev

# 另一个终端,启动前端(端口 5173,自动代理到后端)
cd web && pnpm dev

打开 http://localhost:5173 即可使用。

环境变量

变量 必填 默认值 说明
WEBUI_API_KEY 登录密钥,同时用于派生 JWT 签名
PORT 8172 后端监听端口
CODEX_BIN codex codex CLI 可执行文件路径
CODEX_HOME ~/.codex Codex 主目录
WORKSPACE_ROOTS 逗号分隔的允许访问目录
LOG_LEVEL info Pino 日志级别
WEBUI_DB_PATH CODEX_HOME/codex-webui.sqlite SQLite 数据库路径
WEBUI_UPLOAD_MAX_BYTES 104857600 上传文件大小限制(100MB)
DEFAULT_TERMINAL_CWD 终端默认工作目录
WEBUI_TERMINAL_MAX_SESSIONS 10 最大并发终端会话数(1-50)
WEBUI_TERMINAL_GRACE_MS 45000 断开连接后终端保活时长
WEBUI_TERMINAL_SCROLLBACK 5000 终端回滚缓冲区行数

项目结构

├── src/                  # NestJS 后端
│   ├── codex/            # 进程管理、JSON-RPC 客户端
│   ├── threads/          # 线程 CRUD、WebSocket 网关
│   ├── files/            # 文件操作、路径安全校验
│   ├── terminal/         # 多 tab 终端(node-pty)
│   ├── auth/             # JWT + API Key 认证
│   ├── database/         # SQLite + Drizzle ORM
│   └── ...               # 其他模块
├── web/                  # React 前端
│   └── src/
│       ├── routes/       # TanStack Router 页面
│       ├── components/   # UI 组件
│       ├── stores/       # Zustand 状态管理
│       ├── hooks/        # 自定义 hooks
│       └── generated/    # Hey API SDK(自动生成)
├── Dockerfile            # 多阶段构建 + seed root
└── docker-compose.yml

常用命令

pnpm start:dev          # 后端开发模式
pnpm build              # 编译后端
pnpm test               # 运行测试
pnpm lint               # ESLint 检查
pnpm db:generate        # 生成数据库迁移
pnpm db:migrate         # 执行迁移
cd web && pnpm dev      # 前端开发模式
cd web && pnpm build    # 前端构建(输出到 public/)

License

AGPL-3.0

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors

Languages