企业官网建设流程全解析

互联网是为人类建的，Agent 要用它

Agent 需要和网页交互。填表单、提取数据、截图、导航——这些是 Agent 执行任务的基本动作。问题是，整个互联网的设计预设是"有一个人坐在屏幕前操作"。Agent 不是人，它没有鼠标，没有视网膜，它需要一个专门为它准备好的浏览器基础设施。

这次，Cloudflare 把 Browser Rendering 正式更名为Browser Run，同步发布了一批面向 Agent 场景设计的新功能。名字的变化本身就是一个信号：这个产品的定位从"渲染工具"演进成了"给 Agent 用的完整浏览器基础设施"。

新发布的功能清单：

• Live View：实时看到 Agent 在做什么，包括页面、DOM、控制台和网络请求
• Human in the Loop：Agent 卡住时，人工接管处理，完成后交还控制权
• CDP 直连端点：Chrome DevTools Protocol 直接暴露，Agent 框架和现有脚本可以直接连接
• MCP 客户端支持：Claude Desktop、Cursor、OpenCode 等编码 Agent 可以把 Browser Run 作为远端浏览器
• WebMCP 支持：网站主动声明对 Agent 可用的工具，让 Agent 导航更可靠
• Session Recordings：录下每一个会话，出问题时有完整回放
• 并发上限提升：从 30 提升到 120，提升 4 倍

以下逐一展开。

一、启动一个浏览器

Agent 首先需要一个可以按需开启的浏览器。Browser Run 在 Cloudflare 全球网络上提供无头 Chrome 实例，不需要管理任何基础设施，也不需要维护 Chrome 版本。浏览器会话就近用户所在位置启动，延迟低，按需扩缩，用完即释放。

配合 Agents SDK，可以构建长时间运行的 Agent——浏览网页、记住上下文、自主行动，不需要自己搭一套浏览器管理系统。

二、控制浏览器：四种方式，覆盖不同场景

有了浏览器，Agent 需要能控制它。Browser Run 提供了从高层到低层的多种方式。

CDP 直连端点：最大控制权

Chrome DevTools Protocol（CDP）是浏览器自动化的底层协议。你在 Chrome 里打开开发者工具时，背后运行的就是 CDP。Puppeteer、Playwright，以及绝大多数 Agent 框架，都建立在它之上。

以前，Browser Run 也是通过 CDP 工作的，但开发者只能通过 Puppeteer 或 Playwright 这样的上层封装来使用。现在，Cloudflare 把 CDP 端点直接暴露出来。

对 Agent 来说，这个改变有三点实质意义：

第一，最大控制权。直接访问 CDP 可以使用 Puppeteer 或 Playwright 覆盖不到的浏览器能力，比如 JavaScript 调试。

第二，框架原生兼容。Agent 框架已经在内部使用 CDP，可以直接连接，不需要额外适配层。

第三，Token 效率更高。绕过上层库，把原始 CDP 消息直接传给模型，不需要为封装层的语义转换付出额外 Token 成本。

迁移成本极低。如果已有连接到自托管 Chrome 的 CDP 脚本，只需修改一行配置：

// 之前：连接到本地自托管 Chromeconstbrowser=awaitpuppeteer.connect({browserWSEndpoint:'ws://localhost:9222/devtools/browser'});// 之后：连接到 Browser Runconstbrowser=awaitpuppeteer.connect({browserWSEndpoint:'wss://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/browser-rendering/devtools/browser',headers:{'Authorization':'Bearer <API_TOKEN>'}});

一行改动，不再需要维护自己的 Chrome 基础设施。同时，CDP 端点不依赖 Cloudflare Worker，可以从任何语言、任何环境直接调用。

MCP 客户端支持：让编码 Agent 直接用上浏览器

因为 Browser Run 现在暴露了 CDP 端点，Claude Desktop、Cursor、Codex、OpenCode 这类编码 Agent 可以把 Browser Run 作为它们的远端浏览器。

具体实现是通过 Chrome DevTools 团队发布的chrome-devtools-mcp包——这是一个 MCP Server，把完整的 Chrome DevTools 能力（可靠的自动化、深度调试、性能分析）以 MCP 协议的形式暴露给 AI 编码助手。

配置方式非常简单，以 Claude Desktop 为例：

{"mcpServers":{"browser-rendering":{"command":"npx","args":["-y","chrome-devtools-mcp@latest","--wsEndpoint=wss://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/browser-rendering/devtools/browser?keep_alive=600000","--wsHeaders={\"Authorization\":\"Bearer <API_TOKEN>\"}"]}}}

加上这段配置，Claude Desktop 就有了一个完整的 Chrome 浏览器可以驱动。

WebMCP：让网站主动对 Agent 开放

传统的网页 UI 是为人类设计的。Agent 浏览网页时，往往需要循环"截图 → 分析 → 点击"的过程，速度慢、可靠性低，一旦 UI 发生变化，整条流程就可能失效。

WebMCP 是 Google Chrome 团队推出的新 Web 标准，在 Chromium 146+ 中落地。它允许网站主动声明"哪些操作可以被 Agent 发现并调用"。

两个 API 实现这件事：

• navigator.modelContext：网站用这个接口注册自己的工具，告诉 Agent"我支持哪些操作"
• navigator.modelContextTesting：Agent 用这个接口在页面上发现和调用工具

举个具体场景：今天一个 Agent 访问机票预订网站，需要分析页面结构、找到搜索表单、填写字段，整个过程依赖对 UI 的视觉理解。有了 WebMCP，网站可以声明"我有一个search_flights工具，接受出发地、目的地和日期三个参数"。Agent 直接调用这个工具，跳过所有的 UI 分析过程，更快、更可靠，而且不受 UI 改版影响。

工具是在页面上按需发现的，而不是预加载的。这对于覆盖长尾网站来说非常重要——无法事先为每个可能访问的网站都预配一个 MCP Server，页面级发现机制解决了这个问题。

Browser Run 提供了一个运行 Chrome beta 的实验性浏览器池，可以在稳定版 Chrome 之前测试 WebMCP 等新特性：

npmi-gwrangler@latest wrangler browser create--lab--keepAlive300

现有方式继续可用

Puppeteer、Playwright、Stagehand 这些已有的全浏览器自动化方式，在 Browser Run 上完全不受影响。对于截图、PDF 生成、Markdown 提取这类简单任务，Quick Action 端点依然是最快的选择。

/crawl端点是最近新增的，支持单次 API 调用爬取整个网站：给一个起始 URL，自动发现和抓取页面，返回 HTML、Markdown 或结构化 JSON 格式；支持控制爬取深度和范围，可以跳过未更新的页面，可以指定包含或排除的路径。

值得一提的是爬虫合规性的处理：/crawl端点是一个经过签名认证的合规爬虫，遵守robots.txt和 AI Crawl Control 规则，不会绕过 Cloudflare 的机器人防护或 CAPTCHA。网站所有者对自己内容的可访问性有完整控制权，爬虫尊重这些设置。

三、可观测性：知道 Agent 在做什么

Cloudflare 从用户反馈里总结出一个高频问题：自动化流程失败了，但完全不知道为什么。这次专门针对可观测性做了三方面改进。

Live View：实时目击

Live View 让你看到 Agent 正在操作的浏览器页面，实时、同步，包括页面本身、DOM 结构、Console 输出和网络请求。当自动化出了问题——预期的按钮不在、页面需要登录、出现了 CAPTCHA——你可以立刻发现，而不是等任务失败之后再来排查。

访问方式有两种：通过代码获取session_id和devtoolsFrontendURL，在 Chrome 里打开；或者在 Cloudflare Dashboard 的 Browser Run 部分进入 Live Sessions 标签，点击任意活跃会话查看。

Session Recordings：事后回放

不可能实时盯着每一个会话。Session Recordings 解决了这个问题——它把 DOM 变化、鼠标键盘事件和页面导航记录为结构化 JSON，会话结束后可以完整回放。

启动浏览器时传入recording: true即可开启。会话关闭后，可以在 Dashboard 的 Runs 标签里找到录像，也可以通过 API 获取，用 rrweb-player 在本地回放。接下来还会支持在回放时间轴的任意位置检查 DOM 状态和 Console 输出，不只是看录像，还能在任意时间点"打断点"查看状态。

Dashboard 重设计

旧版 Dashboard 只显示浏览器会话的日志，截图、PDF、Markdown 提取、Crawl 这些请求都不可见，出了问题完全没有线索。新版 Runs 标签把所有类型的请求统一展示，可以按端点类型过滤，每条记录都有目标 URL、执行状态和耗时。

四、人工干预：Agent 卡住时不必重来

Agent 不是万能的。登录页面、双因素认证、意料之外的弹窗——这些场景今天的 Agent 大多数处理不了。如果碰到这类情况只能整个流程重启，实用性会大打折扣。

Human in the Loop提供了另一种处理方式：当自动化遇到障碍，人工接管当前的活跃会话，处理 Agent 无法处理的部分，然后让自动化继续。

现在的实现方式是通过 Live View URL 直接进入活跃会话，操作页面。接下来要做的是更完整的交接流程：Agent 能够主动发出"我需要帮助"的信号，触发通知提醒人工介入，人工处理完成后把控制权明确交回给 Agent，整条流程有完整的状态传递。

五、规模：并发翻了 4 倍

并发浏览器上限从 30 提升到120，Quick Actions 的请求速率提升到10 次/秒。

Browser Run 全球维护一个预热的浏览器实例池，会话打开时立刻可用，没有冷启动等待时间。有更高并发需求的团队可以直接申请提升限额。

路线图

原文在路线图部分列出了四项接下来要做的事情：

Human in the Loop 主动交接流程：现在是人看到问题后主动进入 Live View 接管；接下来是 Agent 主动发出求助信号，触发通知，完成后明确交还控制权，整条交接有完整的系统支撑。

Session Recordings DOM 检查：现在可以在时间轴上前后拖动回放会话；接下来可以在任意时间点检查 DOM 状态和 Console 输出，把录像从"视频"升级成"可交互的调试快照"。

Traces 和浏览器日志：不需要在代码里插桩，Console 日志、网络请求、时序数据自动可查。出了问题，直接看 Trace，知道哪里断的。

Workers Binding 直接调用：截图、PDF、Markdown 提取现在需要通过 REST API 调用，需要 API Token。接下来这些功能将直接作为 Workers Binding 提供，env.BROWSER.screenshot()直接用，不需要 API Token，和调用其他 Workers 服务没有区别。

小结

这次发布的核心是把 Browser Run 从一个渲染工具升级成一个完整的 Agent 浏览器基础设施。五个维度的改进——开启浏览器、控制浏览器、可观测性、人工干预、规模——基本覆盖了一个 Agent 在使用浏览器时会遇到的全部问题。

有几个判断值得单独提出：

WebMCP 的方向比功能本身更重要。今天 WebMCP 支持的网站还很少，但它代表的是互联网基础设施向"对 Agent 友好"演进的方向。网站开始主动声明自己对 Agent 可用的工具，意味着 Agent 和 Web 之间的交互模式会发生根本性的改变——从"Agent 猜测如何操作 UI"到"网站告诉 Agent 能做什么"。

CDP 直连端点打通了现有生态。大量现有的浏览器自动化脚本和 Agent 框架都在用 CDP，只改一行 WebSocket 地址就能从自托管 Chrome 迁到 Browser Run，迁移成本几乎为零。

Human in the Loop 改变了自动化的可靠性预期。以前"自动化不能处理就失败"是默认预设，Human in the Loop 让"自动化处理不了的交给人，人处理完继续自动化"成为一个可以设计进产品里的正常流程。

Browser Run 在 Free 和 Paid 套餐下均可使用，今天发布的所有功能立即可用。

参考链接

• 原文：https://blog.cloudflare.com/browser-run-for-ai-agents/
• Browser Run 文档：https://developers.cloudflare.com/browser-rendering/
• CDP 端点文档：https://developers.cloudflare.com/browser-rendering/cdp/
• WebMCP 文档：https://developers.cloudflare.com/browser-run/features/webmcp/
• Live View 文档：https://developers.cloudflare.com/browser-run/features/live-view/
• Human in the Loop 文档：https://developers.cloudflare.com/browser-run/features/human-in-the-loop/
• /crawl 端点文档：https://developers.cloudflare.com/browser-rendering/rest-api/crawl-endpoint/