About Web Cursor

浏览器内的 AI React 编码沙箱

Web Cursor 把 AI 生成代码、浏览器编译预览和运行错误反馈连成一个闭环。用户只需要描述目标界面，agent 会写项目文件、运行预览，并根据真实结果继续修复。

进入 Playground查看英文介绍页
agent-loop.snapshot
1

Describe

用户描述要做的 React UI，或粘贴带 node-id 的 Figma 设计链接。

2

Generate

服务端 agent 读取上下文，通过文件工具写入 Rsbuild React TypeScript 项目。

3

Preview

浏览器 workbench 用 WebContainer 运行 npm install 和 npm run dev，再用 iframe 打开 dev server URL。

4

Repair

真实错误作为 tool result 回传，agent 基于结果继续修复直到可运行。

核心能力

Web Cursor 的重点不是“展示 AI 生成了代码”，而是把生成结果放进真实运行环境里验证。

自然语言生成 React

把一句产品需求、界面描述或 Figma 链接转成完整 React 项目文件，而不是只吐一段代码片段。

真实浏览器预览

生成结果会在 WebContainer 中安装依赖并启动 dev server，再加载到 iframe 预览。

运行反馈驱动修复

install/dev/browser runtime 错误会回填给 agent，下一轮继续修复。

服务端持有模型密钥

LLM 调用只发生在 Next.js Route Handler 中，浏览器端不会接触 API key。

三执行域边界

LLM、浏览器编排和不可信代码执行被分离，这个边界决定了安全模型和可修复闭环。

A 域 · LLM Agent

Next.js Route Handler 持有模型密钥、读取 transcript、调用工具并流式返回结果。

B 域 · Workbench

浏览器主线程管理聊天、文件、WebContainer、预览状态和用户交互。

C 域 · Preview iframe

iframe 加载 WebContainer dev server URL，展示 AI 生成的不可信应用。