一个基于 Node.js 的 Web 控制台，把 Codex CLI 和 Claude Code 会话装进浏览器窗口中统一管理。

痛点：Codex 和 Claude Code 各有长处，但来回切终端太烦；额度分散不可见，不知道还能用多久。

解决：一个 Web 页面，同时操控 Codex 和 Claude Code，实时流式输出，额度一目了然。

提前准备

在一台 Windows 主机上跑起来，你需要先准备好以下环境：

基础环境

项目	说明
WSL2	Windows Subsystem for Linux 2，建议 Ubuntu 24.04
Node.js ≥ 22	运行 control-plane 和 adapter
Git	拉取代码
Windows Terminal（可选）	比默认控制台好用

AI 工具 CLI

在 WSL 中安装并完成首次登录：

工具	说明
Codex CLI	从 OpenAI 官方获取并安装，执行 codex 完成首次登录授权
Claude Code CLI	从 Anthropic 官方获取并安装，执行 claude 完成首次登录授权

首次登录后 CLI 会保存凭证，后续 nbtangInOne 通过 adapter 调用时无需重复认证。

API Key

Key	用途	获取渠道
DeepSeek API Key	cc adapter 使用的模型后端	platform.deepseek.com
OpenRouter API Key（可选）	CC 图片理解的多模态模型	openrouter.ai

宿主机与 WSL 网络隔离

宿主机只访问国内网络，WSL 走海外代理访问外网，两者网络隔离互不干扰。

在 Windows 用户目录下创建 .wslconfig：

[wsl2]
# NAT 模式，WSL 拥有独立 IP，与宿主机网络隔离
networkingMode=nat

# 不自动同步 Windows 代理，WSL 内单独配置代理
autoProxy=true

# 禁止 localhost 转发，避免网络混流
localhostForwarding=false

WSL 内部需要单独配置代理（例如 export ALL_PROXY=http://<host_ip>:<port>），确保 WSL 进程走海外线路。

宿主机访问 WSL 服务

由于 localhostForwarding=false，127.0.0.1 不通，必须通过 WSL IP + portproxy 转发：

# 在 Windows PowerShell（管理员）中执行
# 查看 WSL IP（在 WSL 终端中 ip addr show eth0）
netsh interface portproxy add v4tov4 listenaddress=127.0.0.1 listenport=13209 connectaddress=<WSL_IP> connectport=3209

每次 WSL 重启后 IP 会变化，建议写个脚本自动更新 portproxy。

以上准备就绪后，继续看下面的部署步骤。

这是什么

nbtangInOne 是一个基于 Node.js 的轻量控制台。它把 Codex CLI（cd）和 Claude Code（cc）装进一个 Web 界面，让你在浏览器上就能操控 AI 编码会话。

我为什么做这个

日常开发中，我在 WSL 里同时用 Codex 和 Claude Code——各有各的擅长场景，但每次都要开终端、记命令、查额度。

痛点很直接：

• 切来切去太烦：同一个项目在 cd 和 cc 都有历史会话，不知道用哪个
• 额度不可见：Codex 的 weekly 额度、DeepSeek 的余额，每次要单独查
• 终端局限：没有图形界面，不能上传图片、不能一键切换工具

于是我写了 nbtangInOne——一个 Web 控制台，把 cd 和 cc 装进同一个页面，统一入口，统一管理。

架构

三个核心组件：

• control-plane：内嵌 Web UI 的 API 网关，负责调度 adapter、认证审批、项目收藏、图片理解编排
• cd adapter：封装 Codex CLI，管理 cd 会话的创建、恢复、执行和 SSE 流式输出
• cc adapter：封装 Claude Code CLI，固定使用 DeepSeek 兼容模型，管理 cc 会话和余额查询

三个组件都在本机运行，plane + cd adapter + cc adapter 一起启动。

主要功能

项目级唯一 Conversation

每个项目只维护一个对话，底层 session 对用户透明。刷新页面、切换设备，回到同一个对话现场。

cd / cc 手动选择

每个项目可以独立选择用 Codex（GPT-5.5）还是 Claude Code（deepseek-v4-pro）。额度不足时对应的 runtime 按钮会禁用，系统不会自作主张帮你切换。

额度可见

• cd：显示 weekly 剩余百分比和 5 小时剩余
• cc：每 5 分钟查询 DeepSeek 余额，显示余额和今日花费（余额快照法估算）

图片理解

上传图片到 cc 时，control-plane 自动调用 OpenRouter 多模态模型生成图片描述，注入 prompt，让 DeepSeek 模型也能"看懂"图片。

部署

环境要求

• Node.js ≥ 22
• Codex CLI（如需 cd）
• Claude Code CLI（如需 cc）
• Linux with systemd（可选，用于自启动）

单机部署（以 WSL 为例）

git clone <repo-url> /home/nbtang/nbtangInOne
cd /home/nbtang/nbtangInOne

# 创建 cc adapter 环境文件（使用 DeepSeek 兼容模型）
mkdir -p ~/.config/nbtanginone
cat > ~/.config/nbtanginone/claude-host-adapter.env << 'EOF'
ANTHROPIC_BASE_URL=https://api.deepseek.com/anthropic
ANTHROPIC_AUTH_TOKEN=your-deepseek-api-key
DEEPSEEK_API_KEY=your-deepseek-api-key
OPENROUTER_API_KEY=your-openrouter-api-key  # 可选，CC 图片理解需要
EOF

# 可选：关闭浏览器审批（单机部署不需要）
echo 'NBTANGINONE_AUTH_DISABLED=1' > ~/.config/nbtanginone/control-plane.env

# 配置 hosts.json 为本机 adapter
# 安装 systemd 自启动
./install-autostart.sh
./install-control-plane-3209-autostart.sh

# 启动
./start-nbtanginone.sh

启动后访问 http://127.0.0.1:3209。

技术栈

• 后端：Node.js（.mjs ES 模块，零 npm 依赖）
• 前端：Vanilla JS SPA，内嵌在 control-plane 中，SSE 流式响应
• 进程管理：systemd user service（可选）
• 网络：NAT portproxy 转发

最后

这个项目解决的是我自己的真实痛点——同时用 Codex 和 Claude Code，不想在终端里来回切。代码量不大，核心就几个 .mjs 文件和一个内嵌 Web UI，没有构建工具、没有框架依赖、没有数据库。

如果你也有类似场景，欢迎拿去用或改。有问题提 issue，有想法提 PR。

已知局限

当前 cd 和 cc 分别维护独立的会话上下文，切换 runtime 后新 runtime 不会感知对方之前的对话历史。这个问题已经有了解决思路，后面会单独写一篇博客详细说明。

比如：先在 cd 里聊了一轮需求澄清，切到 cc 后 cc 不知道刚才聊了什么——需要手动复述上下文。

---

代码仓库：https://gitcode.com/gcw_A202cbBm/aicli.git