Gemini CLI WebUI 安装使用教程:免费AI编程助手的图形界面方案

Gemini CLI UI为免费的Gemini CLI提供了图形化Web界面
开源项目Gemini CLI UI基于Cloud Code Web UI改版,为Google免费的Gemini CLI命令行工具补上了图形界面短板。它支持多项目管理、多会话并行、YOLO自动执行模式、图片上传、响应式布局和远程服务器部署,完全兼容现有Gemini CLI配置和免费额度,是目前性价比最高的AI编程助手界面方案之一。
Google 的 Gemini CLI 命令行工具一直是 Claude Code 的有力竞争者——完全免费、支持 Gemini 2.5 Pro 模型、额度慷慨。但它有一个明显短板:缺少一个好用的图形界面。现在,一个名为 Gemini CLI UI 的开源项目终于补上了这块拼图,让 Gemini CLI 拥有了媲美 Claude Code Web UI 的操作体验。
为什么 Gemini CLI 需要一个 Web UI?
在 AI 编程助手领域,Claude Code 凭借强大的命令行能力和不断涌现的第三方 UI(如 Claudia、Tarragon、Crystal 等)占据了大量关注。相比之下,Gemini CLI 虽然功能不逊色,却因为缺少直观的用户界面而被很多开发者忽视。
要理解这场竞争的背景,需要了解两款工具的定位差异。Gemini CLI 是 Google 于 2025 年中推出的开源命令行 AI 编程工具,基于其最新的 Gemini 2.5 Pro 模型,该模型拥有高达 100 万 token 的上下文窗口,在代码理解和生成方面表现出色。Google 为其提供了极为慷慨的免费额度——每分钟 60 次请求、每天 1000 次请求,这在同类工具中几乎没有对手。Claude Code 则是 Anthropic 推出的 AI 编程命令行工具,依托 Claude Sonnet/Opus 系列模型,需要付费订阅(Pro 计划每月 20 美元或 Max 计划每月 100-200 美元)。两者在终端环境下的能力不相上下,但 Claude Code 因为更早建立了生态,围绕它涌现了大量第三方图形界面项目,形成了明显的用户体验优势。
命令行工具的局限性显而易见:你无法方便地管理多个项目和会话,无法在手机上随时查看任务进度,也无法直观地浏览代码差异。Gemini CLI UI 正是为了解决这些痛点而生。
它基于 Cloud Code Web UI 开发(本质上是一个 fork),但将底层的 Claude Code 替换为 Gemini CLI。这里需要解释一下这种开发模式:Cloud Code Web UI(也称 Claude Code Web UI)是社区为 Claude Code 开发的开源 Web 界面项目,它通过封装 Claude Code 的命令行接口,将终端交互转化为浏览器中的图形化操作。Fork 是开源社区中常见的开发模式——开发者复制一个已有项目的代码仓库,在此基础上进行修改和定制,而不必从零开始构建。Gemini CLI UI 正是采用了这种方式,保留了 Cloud Code Web UI 成熟的前端界面、项目管理逻辑和会话系统,仅将底层调用的 AI 引擎从 Claude Code 替换为 Gemini CLI。这种做法大幅降低了开发成本,同时继承了原项目经过社区验证的稳定性和功能完整性。这意味着你可以享受成熟的 Web 界面体验,同时使用 Gemini 完全免费的额度。

Gemini CLI UI 核心功能详解
项目与会话管理
界面左侧提供了清晰的项目管理面板,你可以:
- 添加多个项目:只需指定项目路径即可快速添加
- 管理会话(Session):每个项目下可以创建多个独立会话
- 后台持续运行:启动任务后可以离开,稍后再回来查看进展
这种设计特别适合同时处理多个代码库的开发者,不同项目的上下文完全隔离,互不干扰。多会话并行是 Web UI 相比原生命令行的一个关键优势。在传统终端中,每个 Gemini CLI 实例占用一个终端窗口,管理多个任务需要频繁切换窗口或使用 tmux 等终端复用工具,操作繁琐且容易混淆上下文。而在 Gemini CLI UI 中,每个会话是一个独立的对话线程,拥有自己的上下文历史和工作目录。你可以在一个会话中让 AI 重构后端 API,同时在另一个会话中让它编写前端组件,两个任务互不干扰、并行推进。这种工作模式本质上是将 AI 当作多个"虚拟程序员"来使用,极大提升了开发效率,尤其适合全栈开发者或需要同时维护多个微服务的团队。
模型选择与权限配置
在设置面板中,你可以灵活配置:
- 模型选择:支持 Gemini 系列所有可用模型
- YOLO 模式:开启后 AI 可以访问所有工具,无需逐一确认权限
- 工具访问控制:可以精细地启用或禁用特定工具
- 通知提示音:任务完成时播放提示音,方便后台运行时及时获知结果
其中 YOLO 模式值得特别说明。YOLO(You Only Live Once,意为"你只活一次")是 AI 编程工具中的一种自动化执行模式。在默认情况下,AI 编程助手在执行文件写入、删除、运行 Shell 命令等敏感操作前,会逐一弹出确认提示,要求用户手动批准。这种机制虽然安全,但在处理大型任务时会频繁打断工作流。开启 YOLO 模式后,AI 将获得所有工具的自动执行权限,无需人工逐步确认,从而实现真正的"发起任务后离开"体验。但这也意味着 AI 可能执行意料之外的操作,比如删除文件或运行危险命令。因此,建议仅在受控环境(如 Docker 容器或沙箱中)或非关键项目中使用该模式,生产环境应保持默认的权限确认机制。

丰富的交互方式
在对话界面中,Gemini CLI UI 提供了多种交互手段:
- 文本提示输入:直接输入自然语言指令
- @ 符号引用文件:键入
@可以指定需要修改的文件 - 图片上传:支持上传截图或设计稿作为参考
- 手动编辑文件:无需 AI 介入,直接在界面中编辑代码
- 源代码管理:查看代码注释、差异改动等 Git 相关信息

响应式布局与远程访问
作为 Web UI,它天然支持:
- 响应式布局:在手机、平板、桌面端都能良好显示
- 服务器部署:可以部署在远程服务器上,通过浏览器随时随地访问
- 安全认证:首次启动时会要求创建登录凭证,保障访问安全
响应式布局(Responsive Design)是一种 Web 前端设计方法,通过 CSS 媒体查询和弹性布局等技术,使同一个网页能够根据访问设备的屏幕尺寸自动调整排版和元素大小。Gemini CLI UI 基于现代前端框架构建,天然具备这一能力。而远程服务器部署则是 AI 编程工具的一个重要使用场景:开发者可以将 Gemini CLI UI 部署在一台高性能的云服务器或本地工作站上,AI 的代码生成和文件操作都在服务器端执行,用户只需通过浏览器连接即可。这意味着你可以用一台低配的笔记本甚至手机来控制远程服务器上的 AI 编程任务,特别适合需要长时间运行的代码生成场景——比如让 AI 重构一个大型项目,你可以在手机上随时查看进度。
Gemini CLI UI 安装与使用指南
整个安装过程非常简洁,几步即可完成:
- 克隆仓库:将 Gemini CLI UI 项目克隆到本地
- 安装依赖:运行依赖安装命令
- 配置环境变量:复制
.env示例文件并根据需要修改 - 启动服务:运行启动命令,服务默认在 4009 端口启动
- 创建凭证:首次访问时设置登录用户名和密码
由于 Gemini CLI UI 本质上是对 Gemini CLI 的封装,它完全兼容你现有的 Gemini CLI 配置——无论你使用的是免费版还是自己的 API Key。关于认证方式,Gemini CLI 支持两种选择:Google 账号登录(OAuth)和 API Key。使用 Google 账号登录时,用户可以享受 Google 提供的免费额度(每天 1000 次请求),无需任何付费。而 API Key 方式则是通过 Google AI Studio 生成密钥,按照 Gemini API 的定价计费,适合需要更高调用量或企业级使用的场景。如果你已经在终端中配置好了 Gemini CLI 的认证信息,UI 会直接复用这些配置,无需重复设置。值得注意的是,免费额度虽然慷慨,但存在速率限制,在高频使用时可能遇到请求排队的情况,此时切换到付费 API Key 可以获得更稳定的体验。

实际体验:用 Gemini CLI UI 写一个扫雷游戏
在视频演示中,作者创建了一个空白项目文件夹,然后直接在对话框中输入"制作一个简单的扫雷游戏"。发送后,Gemini CLI 立即在后台开始工作,实时更新进度。整个过程流畅自然,与直接使用命令行工具的效果一致,但操作体验大幅提升。
这种"发起任务-离开-回来查看结果"的工作模式,对于耗时较长的代码生成任务尤其实用。你可以同时在多个会话中启动不同的任务,让 AI 并行工作。
Gemini CLI UI 与同类工具对比
| 特性 | Gemini CLI(原生) | Gemini CLI UI | Claude Code Web UI |
|---|---|---|---|
| 使用成本 | 免费 | 免费 | 需要 Claude 订阅 |
| 图形界面 | ❌ | ✅ | ✅ |
| 多项目管理 | ❌ | ✅ | ✅ |
| 移动端访问 | ❌ | ✅ | ✅ |
| 后台运行 | 有限 | ✅ | ✅ |
| 服务器部署 | 手动配置 | ✅ | ✅ |
Gemini CLI UI 最大的优势在于免费 + 好用的界面这一组合。对于预算有限但又需要 AI 编程助手的开发者来说,这可能是目前性价比最高的方案。
总结
Gemini CLI UI 的出现填补了 Gemini 生态中一个重要的空白。它让原本只能在终端中使用的强大工具变得更加易用和灵活。虽然它本质上是 Cloud Code Web UI 的改版,但这种"站在巨人肩膀上"的做法恰恰保证了界面的成熟度和稳定性。
如果你一直在使用 Gemini CLI 但苦于命令行的局限,或者你想找一个免费的 AI 编程助手方案,Gemini CLI UI 绝对值得一试。随着 Gemini 模型能力的持续提升,这套组合的价值只会越来越大。
核心要点
- Gemini CLI UI 是基于 Cloud Code Web UI 开发的开源项目,为免费的 Gemini CLI 命令行工具提供了完整的图形化 Web 界面
- 支持多项目管理、多会话并行、后台运行、YOLO 模式、图片上传等丰富功能,可部署在服务器上通过任何设备远程访问
- 完全兼容现有 Gemini CLI 配置,支持免费额度和自定义 API Key,是目前性价比最高的 AI 编程助手界面方案之一
- 安装过程简洁,克隆仓库、安装依赖、配置环境变量后即可在 4009 端口启动使用,首次访问需创建安全登录凭证
- 响应式布局支持手机、平板等多终端访问,适合需要随时查看 AI 编程任务进度的开发者
相关推荐
教程攻略Cursor+Codex双IDE协同:开源项目二开实战方法论
基于实战经验总结的开源项目二次开发完整方法论,详解Cursor+Codex双IDE协同工作流,涵盖二开七环节、MVP验证、AI读源码技巧,帮助开发者三天跑通项目、两周完成业务集成。
教程攻略Cursor多Agent实战:50分钟搭建Next.js全栈博客
使用Cursor IDE多Agent协作模式,50分钟内从零搭建全栈博客。涵盖Next.js、Clerk认证、Supabase数据库集成,详解4个AI Agent分阶段开发流程与关键避坑经验。
教程攻略从零搭建AI软件工厂:Cursor工程师的多Agent协作实战经验
Cursor工程师Eric分享AI软件工厂构建实战:从自动化六层级、护栏设计、并行Agent管理到规模化扩展,详解如何用多Agent协作实现7×24小时高效软件开发。