第八篇：《Codex Web 端与 Cloud 集成：在浏览器中完成工程任务》

前几篇文章介绍的 CLI、桌面应用和 IDE 插件有一个共同点活都在你这台电脑上干——读本机文件、跑本机命令电脑一关它就歇了。Codex Cloud 反过来你在浏览器里下个单活跑在 OpenAI 自己的云机器上跟你这台电脑彻底脱钩。 云端版是把 Codex 搬到了 OpenAI 的云上——你不用配任何环境浏览器打开网页连上 GitHub给它派活它在云端一台隔离机器里读代码、改代码、跑测试干完直接给你交 diff、提 PR。本文从云端任务流程讲起深入讲解环境配置、GitHub PR 集成、图像生成能力并通过完整实战帮你掌握云端 Codex 的用法。一、一个真实场景今年五月有天下午我手头一个几千行的 Python 服务 CI 突然挂了三个互不相干的失败用例全是那种“不难修但得一个个看”的琐碎活。搁以前我得守着终端一条条改。那天我直接在 chatgpt.com/codex 上一口气派了三个任务——一个失败用例一个任务三台云机器同时开跑。我合上笔记本去开了个会回来一看三个改好的 diff 整整齐齐躺在那儿等我点“提 PR”全程我这台电脑连风扇都没转。二、云端任务的 5 步流水线一个云端任务从建容器到交 diff走的是 5 步流水线text建容器 → 跑设置脚本可联网→ 应用网络设置Agent 默认断网→ Agent 干活 → 交 diff第 1 步建容器——每次任务都新建一个隔离容器把你的仓库拉进去关起门来折腾跟你本机零接触。第 2 步跑设置脚本——执行你在环境配置中定义的安装命令如 pnpm install这一步可以联网下载依赖。第 3 步应用网络设置——Agent 干活时默认断网。这是安全设计防止 Agent 在未经授权的情况下访问外部服务。第 4 步Agent 干活——Codex 在容器内读代码、改代码、跑测试。它默认不会中途问你会把整个任务跑完。第 5 步交 diff——任务完成后Codex 提交一个 diff代码变更你可以审查后一键创建 PR。三、连接 GitHub 与创建 PR3.1 授权 GitHub第一次使用云端版需要连接 GitHub 账号。你可以授权全部仓库也可以只选择特定仓库。3.2 创建 PR 的完整流程任务完成后Codex 会给出 diff 和摘要。你可以审查 diff查看 Codex 改了什么。请求后续修改如果不满意可以让 Codex 继续修改。创建 PR满意后点击“Create PR”按钮Codex 会通过 GitHub 自动创建 Pull Request。3.3 codex 工作流在 GitHub PR 中你可以通过 codex 触发两种工作流codex review走代码审查线Codex 自动审查 PR 中的代码质量、安全漏洞。codex fix the P1 issue走通用云任务线Codex 启动云任务修改代码在你授权了写权限时把修复推回 PR 分支。四、图像生成从设计稿到代码Codex 现在可以使用 gpt-image-1.5 来创建和迭代图像。结合截图和代码这有助于在同一个工作流中为产品概念、前端设计、原型和游戏创建视觉内容。4.1 实战设计稿转前端代码一个典型的工作流是Codex 生成设计稿用 gpt-image-1.5 生成 UI 设计图或 mockup。Codex 分析设计稿读取生成的设计图分析布局、颜色、组件结构。Codex 实现代码根据分析结果生成前端代码。浏览器验证在应用内浏览器中预览效果迭代调整。社区已经有专门的 image-to-code skill用于把 UI 截图、设计稿、页面参考图转换成可用代码实现的结构化 UI。4.2 Figma MCP 集成Codex 还支持与 Figma 通过 MCP 协议集成先让 Codex 读取 Figma 设计上下文再生成代码最后用 Playwright 在浏览器里校验效果。五、应用内浏览器与背景电脑操作2026 年 4 月的更新为 Codex 桌面应用带来了内置浏览器。你可以直接在网页上留下评论作为给 Agent 的精确指令。这对前端开发和游戏开发特别有用。同时Codex 现在可以通过背景电脑操作功能用自己的游标查看、点击和输入直接操作你电脑上的各种应用程序。多个智能体可以在你的 Mac 上并行工作而不会干扰你在其他应用中的操作。这对于以下场景特别有用反覆调整前端变更并实时查看效果测试没有 API 的应用程序在浏览器中进行端到端测试六、云端 vs 本地取舍对照表什么活该丢上云并行跑多个任务每个任务独立容器、独立分支本地没有克隆的仓库长时间运行的重型任务重构、大规模测试生成不在电脑旁、只有浏览器时临时使用什么活老实留本地需要访问本地文件系统或本地环境的任务需要频繁交互和即时反馈的任务涉及敏感数据、不能上传到云端的任务七、实战用 Codex Cloud 完成一个完整任务场景一个 Go 项目需要批量修复 3 个失败的测试用例。步骤一打开 Codex Cloud访问 chatgpt.com/codex连接 GitHub 账号。步骤二选择仓库并配置环境选择目标仓库在环境配置中设置安装命令go mod download步骤三下达任务text修复以下 3 个失败的测试用例TestOrderCreate 中的库存扣减断言失败TestPaymentCallback 中的超时处理TestUserLogin 中的密码加密验证每个任务独立处理完成后分别提交 diff。步骤四审查结果Codex 在云端并行执行 3 个任务完成后返回 3 个独立的 diff。你可以在浏览器中逐一审查。步骤五创建 PR确认无误后为每个 diff 创建 PR。PR 中会包含变更摘要和验证结果。八、小结云端定位浏览器中下单OpenAI 云上干活电脑关机任务继续。5 步流水线建容器 → 跑设置 → 应用网络设置 → Agent 干活 → 交 diff。GitHub 集成授权仓库 → 审查 diff → 创建 PR支持 codex review 和 codex fix 工作流。图像生成gpt-image-1.5 生成设计稿结合代码实现前端。应用内浏览器直接在网页上留评论作为精确指令。背景电脑操作多个智能体并行操作 Mac 上的应用程序。取舍原则并行任务、远程仓库、长任务丢上云本地文件、即时反馈、敏感数据留本地。