帮你快速理解、总结文档立即下载

Vibe Coding

最近更新时间:2026-08-19 15:45:03
我的收藏
Vibe Coding 平台让终端用户通过自然语言创建和修改应用,平台负责生成代码、运行验证并交付可访问的应用。Vercel v0、Lovable 等产品都属于这一形态。
EdgeOne Makers 将 Agent 运行时、隔离沙箱与应用托管能力放在同一平台中,使平台方可以构建「对话生成 → 实时预览 → 应用上线 → 多租户隔离」的完整链路,而不必自行维护沙箱集群和构建基础设施。

方案优势

价值
具体表现
一个平台闭环
Agent 运行时、代码沙箱、构建部署同处一个平台。终端用户在对话中发起上线请求后,几分钟后就能拿到可访问的 HTTPS 地址
框架深度适配
深度适配 Next.js、Nuxt、Astro 等主流框架,SSR / ISR / SSG 等现代渲染模式在边缘直接生效,与 AI 生成应用的主流技术栈天然契合
安全运行
每个会话拥有独立沙箱,AI 生成的不可信代码在隔离环境中执行;应用上线后继续运行在边缘安全平台上——防护能力由基础设施提供

核心架构与能力

整体架构:1 个平台 + N 个用户应用

平台侧负责编排与决策,沙箱负责执行与验证,边缘托管负责对外交付。



图中包含两条请求链路:
Vibe Coding 用户链路:终端用户在产品页面描述需求,Agent 调用模型并驱动沙箱写代码、构建和启动预览;确认效果后,由运行时读取产物并调用部署 API,返回正式访问地址。
终端用户链路:终端用户通过租户域名访问已部署应用,请求由 EdgeOne 边缘节点就近处理并返回响应。

核心能力

能力层
职责
Agent 编排与模型
理解需求、规划步骤、调用工具并生成代码、会话持久化
沙箱工具
在隔离环境中写文件、装依赖、构建并启动应用、代码持久化
开源项目示例
基于 Claude Agent SDK + TypeScript 实现的代码生成模板
创建项目、上传制品、触发部署,项目、配置、域名与用量相互隔离

Agent 编排与模型

Agent 运行时

承载 LLM 调用、Agent 循环编排与业务逻辑,支持长时运行任务,按会话路由、自动扩缩容。agents/ 目录下的每个公开文件对应一个 Agent 端点,平台负责路由并注入运行时上下文:
// agents/chat.ts
export async function onRequest(context: any) {
context.store // 对话存储
context.tools // 沙箱工具,LLM 视角
context.sandbox // 沙箱原子 API,开发者视角
}
特性
说明
长时任务
支撑 Agent 多轮工具调用、依赖安装和构建
会话路由
conversation_id 绑定对话上下文与沙箱工作区,多轮请求复用同一项目
框架可替换
可接入 DeepAgents、LangGraph、CrewAI、OpenAI Agents SDK、Claude Agent SDK 等框架
职责分离
agents/ 承载 AI 逻辑;cloud-functions/ 承载 普通业务 API

接入模型

Makers Models 是部署在 EdgeOne 边缘节点的统一模型接入服务,提供从客户端 SDK 到大模型厂商的一站式调用通道。开发者通过统一端点接入与单一 API Key 即可调用多家主流厂商的大模型,无需携带厂商密钥以及兼容多个标准协议,帮助您快速构建高性能的 AI 应用。
方式
配置
适用
内置模型
配置 Makers Models API Key 和网关地址,使用平台提供的模型额度
无需外部模型供应商账号,适合快速验证
自带 API Key
绑定自有模型供应商
需要特定模型,或希望成本与配额自控

沙箱工具

沙箱工具 底层是腾讯云的隔离实例,专门承载 Agent 执行过程中的"副作用"——跑命令、读写文件、操控浏览器、运行代码,让 LLM 真正具备"动手"能力,而不是只能输出文本。
能力
说明
会话隔离
每个会话使用独立工作区,异常不应影响其他租户
按需创建
首次需要执行时再创建,并在超时后自动回收
命令与文件操作
安装依赖、构建、启动服务以及读写项目文件
端口预览
将沙箱内服务映射为临时公网地址
持久化
通过 Blob 将生成的代码持久化,确保跨对话、跨实例保留
实例控制
查询状态、延长超时、获取地址或主动销毁实例

实时预览

预览是 Vibe Coding 体验的核心——用户需要在生成代码后看到效果,预览地址由沙箱端口映射而来,随沙箱回收失效。




沙箱持久化

沙箱是会随超时回收的临时工作区。要支持用户跨时段继续开发,必须持久化项目文件。因此在同一会话需要跨沙箱实例继续时:调用 persist() 保存快照,实例重建后调用 restore() 恢复。



保存工作区代码
在每轮代码修改完成后调用 persist()
try {
const persist = await context.sandbox.persist();
} catch (error) {
// 保存失败不影响当前沙箱继续工作,可记录日志并稍后重试
console.warn('Failed to save workspace:', error);
}
persist() 无需传入 conversation_id,当前沙箱已与会话绑定,每次调用都会更新该会话的最新快照。
建议在以下时机调用:
每轮代码修改完成后;
长任务执行期间定时保存。
恢复工作区代码
新沙箱创建后,Agent 开始读写项目文件前调用 restore()
const result = await context.sandbox.restore();
注意:如果 restore() 返回 failed,本轮不要再调用 persist(),否则可能用不完整的工作区覆盖上一次可用快照。

开源项目示例

vibe-coding-agent 是 Makers 基于 Claude Agent SDK + TypeScript 实现的代码生成模板,您可以基于它快速搭建自己的 Vibe Coding 平台。

开箱能力

能力
当前实现
Agent 运行时
使用 Claude Agent SDK 任务编排,工具调用
模型调用
基于 Makers Models 可切换多个大模型调用
代码沙箱与实时预览
LLM 生成的代码在隔离环境中安全运行,沙箱可获取预览地址,代码生成后即可看到运行效果
工作区持久化
从源码快照恢复工作区、重新安装依赖并重启预览
文件浏览
/file 路由按需读取工作区文本文件,前端展示文件树和源码
源码导出
打包工作区并下载源码归档,配置 GitHub OAuth 后可推送到用户仓库

快速开始

$ npm install -g edgeone
$ edgeone makers create --template vibe-coding-agent
$ cd vibe-coding-agent && edgeone makers dev
▸ runtime http://localhost:8088
▸ devtools http://localhost:8088/agent-metrics

平台多租户部署能力

沙箱预览用于开发过程中的即时反馈,地址会随实例回收而失效。要让终端用户长期访问生成的应用,需要将构建产物部署到正式项目。



Makers Vibe Coding 解决方案针对部署采用「一个租户对应一个项目」的模式:平台方通过 SDK 统一创建和管理项目,每个租户的代码、配置、域名与用量相互隔离。
能力
说明
SDK 部署
支持 SDK 完成创建项目、上传制品、触发部署,平台方用自己的 API Token 统一代理部署,终端用户无需注册 Makers 账号,全程留在你的产品中
多租户隔离与域名自动化
每个租户独立项目,代码、配置、域名与用量天然隔离,泛域名自动分配子域
项目级用量统计
按项目独立统计请求、流量与 Token,支持基础用量数据查询,平台方可据此自行实现配额、计费与运营能力
平台多租户部署能力目前处于灰度测试阶段,如需将该能力集成到你的产品中,可通过 联系我们 申请接入。我们将提供开放 API 与技术支持,并根据具体业务场景协助完成方案落地。