为任何网站提供 WebMCP 接口

发布于

今天,我们在 Cloudflare 上推出了 WebMCP 的开发者预览版。只需打开开关,您的网站即可让浏览器代理开始工作,无需编写代码,也无需在源站点进行任何更改。Cloudflare 会在您的页面上添加一个小桥接,从而为访问者的代理注册一组工具。

网络构建时的假设是在另一端有一个真实的人:有人阅读页面、点击按钮以及填写表单。但如今,越来越多的访问来自于 AI 代理,而网络却是为人类而创建的。常见的方法是爬虫,它们将内容复制回服务器,然而,原始网站却往往得不到足够的流量和信用。现在,有一种更好的方法,它并不涉及抓取。

WebMCP 是一种新的浏览器标准,在 Chrome 146 中以实验性方式推出,它在页面中表现为 `document.modelContext`。网站可以选择公开一组适用于浏览器运行的工具,这样,代理就不再需要盲目探索为人类构建的页面。这使得代理可以拥有不同于用户的浏览体验,并对任务使用令牌,而非进行导航。需要注意的是:网站必须实现它。

Cloudflare 在这方面构建了两端。我们的远程浏览器 [BrowserRun](https://developers.cloudflare.com/browser-run/) 已经添加了对 WebMCP 的支持,因此代理可以发现并调用网站公开的工具。 [Cloudflare Radar](https://radar.cloudflare.com/) 很快也会提供自己的 WebMCP 工具。这次预览的重点是:让任何在 Cloudflare 上的网站通过一个开关即可获得这些工具,而无需编写任何代码。

## WebMCP 的开发者预览
手动实现 WebMCP 是一个小项目:设计要公开的工具,将它们集成到您的界面中,并保持它们在标准不断发展的同时正常工作。我们希望比这更简单:只需切换一个设置来启用工具。

这些工具以包的形式出现——一组相关工具可以同时开启。这些工具是逐步扩展的:随着我们添加更多包,网站可以选择通过开启它们而获得更多功能,无需重新部署。我们在此开发者预览中包含了两个工具包,这两个包均在浏览器内运行。

## 这会做什么以及如何工作
我们的实现由两个部分构成,均位于您的源站点前面。两者都不会触及您网站的代码,并且无论您的网站是静态的还是单页面应用,它们的工作方式都是一样的。

首先是在边缘进行的注入。当您的网站在 Cloudflare 控制面板上启用 WebMCP 时,我们使用 HTMLRewriter 在每个 HTML 响应中添加一行:一个小的桥接脚本引用,它也由我们提供。标记和加载的脚本都来自边缘,相同的源,因此页面的其他内容不变:

`data-packs` 属性是要激活的包的列表。如果您有一个现有的模型上下文协议(MCP)服务器,`data-mcp-url` 指向您自己的 MCP 服务器(默认为相同源的 `/mcp`)。

其次是桥接。它在页面中运行并查找 WebMCP 接口。如果浏览器没有这个接口,它会返回并不执行任何操作,因此页面的行为与之前完全相同。

然后,桥接将 `data-packs` 中的包合并成一个工具列表,并使用 `.registerTool` 注册每一个。一个包仅仅是一组MCP工具描述符及其处理程序。静态包,如内容凭证,会提前声明其工具。动态包,如网站 MCP 服务器包,在启动前发现其工具,然后再注册任何东西。

在此次预览中,所有工具都完全在访问者的浏览器中运行。没有与我们的服务器的往返请求。内容凭证包会获取一张图片并在本地解析其前几个千字节的内容来源元数据。网站 MCP 服务器包则直接从页面与您的 MCP 服务器端点通信,使用访问者的源站点及其现有会话。

桥接代码由在边缘运行的 Worker 提供。这样留给我们进一步扩展的空间——未来的包将能够调用此 Worker 进行页面无法单独完成的任务,例如与 Workers AI 一起总结网站地图或查询 AI 搜索索引。

对于代理来说,所有这些都是普通的 MCP 工具。我们使用模型上下文协议自己的 `Tool` 和 `CallToolResult` 类型,因此,已经与 MCP 服务器通信的代理可以毫不费力地驱动页面,此外,浏览器仅仅是 MCP 运行的另一个地方。以下示例展示了桥接如何将您的 MCP 工具转换为访问者代理可以调用的工具。

## 检查内容元数据
我们还在开发读取不同类型元数据的包。例如,使用内容凭证包可以检索 [C2PA](https://c2pa.org/) 计划参与者的凭证。`scan_images_c2pa` 将扫描每张图片并返回每张图片的简要摘要:

更深入的研究,`inspect_image_c2pa` 解码一张图片的完整清单:其编辑历史、声明作者及签名证书。这是一个简单的 TypeScript 读取器,只涉及图像前面的几千字节而不触及图像本身。目前,它读取并报告凭证,而不是进行加密验证:每个结果都携带 `signatureVerified: false`,因此,代理不会将解码的声明误认为已检查过的。

## 试用一下
要开始使用 WebMCP,请访问 [Cloudflare 控制面板中的 Agent Readiness > Labs](https://dash.cloudflare.com/?to=/:account/:zone/agent-readiness/labs)。在这里,您可以为一个域切换 WebMCP,并选择要添加的包:内容凭证和网站 MCP 服务器默认都开启,更多包会在我们发布时出现在这里。整个设置过程没有任何部署,也无需在源站点进行任何更改,您网站发送的下一个 HTML 将包含桥接。

要确认它已生效,请向您网站请求任何 HTML 页面,并查找 Cloudflare 注入的那一行:

您无需自己的代理也能看到工具的工作。将 [BrowserRun](https://developers.cloudflare.com/browser-run/features/webmcp/) 指向您的 URL,它将发现并调用您注册的工具,正如访问者代理所做的那样。这整个过程是:BrowserRun 为代理提供了一个浏览器来进行操作,此预览为您的网站提供了工具,二者通过开放标准相遇。工具的行为在某个人的笔记本电脑或在云中以无头模式运行时都是一样的。

## 我们为何构建这个
我们的工作是帮助让互联网变得更好,随着互联网的改变,我们需要为域名所有者提供工具,使新访问者(AI 代理)能够互动,而无需完全重建。这朝着一个即使在访问者不完全是人类时仍能繁荣发展的网络迈出了一步。

这是开发者的预览版,我们希望获得您反馈。打开它,尝试在自己的站点上运行,并通过 [Cloudflare 开发者 Discord](https://discord.cloudflare.com/) 或 [社区论坛](https://community.cloudflare.com) 告诉我们使用体验。

---

原文链接:[点击查看](https://blog.cloudflare.com/webmcp/)

评论

暂无评论。

0.033972s