如何将 WebMCP 与编码代理配合使用
假设你正在浏览器中编辑一份演示文稿,然后让编码代理把第二张幻灯片上的文字缩短一些。对你来说,这只是个小改动——你能看到幻灯片,点击文本框,然后开始输入就行。但对代理来说,这可能要费不少功夫。取决于它能用的浏览器工具,代理可能需要检查页面、找到第二张幻灯片、定位正确的文本框、搞清楚怎么编辑、完成修改,然后再验证是否生效。对于一个应用本来就知道该怎么做的操作,代理却要在浏览器里折腾一大圈。
如果演示文稿应用能直接给代理提供一个 update-slide 工具呢?这就是 WebMCP 背后的思路。WebMCP 让网页能够向 AI 代理暴露结构化的工具。页面不必让代理从界面去推断应用能做什么,而是可以明确地暴露诸如 update-slide、send-email 或 create-event 这样的操作,并附带描述和结构化输入。界面依然存在。WebMCP 只是给代理提供了另一种与应用交互的方式,不必再复现人的每一次点击。
WebMCP 与传统 MCP 的对比
乍一听,WebMCP 像是把 MCP 搬进了浏览器。但它们工作在不同的层面。
想象你正在编辑一份演示文稿,选中了第七张幻灯片。你改了标题、打开了格式面板,还有几处编辑尚未保存。传统的 MCP 服务器可能知道后端存储的演示文稿内容,但它无法自动了解你当前浏览器会话里发生了什么:选中了哪张幻灯片、编辑器处于什么状态、你在本地改了哪些东西。
有了 WebMCP,演示文稿编辑器可以暴露在该实时浏览器上下文中操作的工具。这样,代理就不必通过后端 API 去重建你当前的状态,也不用靠浏览界面来猜测,而是可以直接使用你正在使用的应用所暴露的能力。想深入了解 WebMCP 的工作原理以及浏览器为何需要它,请阅读我们的 WebMCP 完整指南。
但你的编码智能体怎么访问这些工具?实际使用中还缺一环。网页可以暴露 WebMCP 工具,但编码智能体还得有办法在自己的浏览器环境里发现并调用它们。WebMCP 规范解决的是页面如何为浏览器自己的智能体注册工具,并没有定义外部智能体(比如终端或编辑器里的那个)该怎么访问这些工具。
这正是 /webmcp 要解决的问题。我们构建了这个技能,教编码智能体如何与支持 WebMCP 的应用配合工作。给它一个应用和一项任务,它会在智能体内置的浏览器里打开应用,先查找页面暴露的工具,然后再尝试操作界面。
这些就绪后,你可以给智能体这样的任务:
/webmcp slides shorten the text on slide two
智能体不用去琢磨该点哪个文本框、改哪里,可以直接使用应用暴露的能力。
安装并运行 /webmcp
在项目终端里安装这个技能:
npx @agent-native/skills@latest add --skill webmcp
安装程序会让你选择安装位置,以及是项目级还是用户级可用。
运行之前有一点要说明:安装技能只是给智能体提供了使用 WebMCP 的指令,并不包含浏览器能力本身。智能体所在环境仍然需要能访问页面暴露的工具,比如兼容的 WebMCP 桥接器或 JavaScript 求值器。
具备这些之后,就可以给 /webmcp 指定应用和任务:
/webmcp slides create a three-slide project kickoff deck for the support team
你也可以把 slides 换成其他兼容应用的 URL。
Agent-Native 应用自身会提供 document.modelContext,所以不需要支持 WebMCP 的浏览器也能用。其他站点则需要 Chrome 的 WebMCP 标志或源试用(origin trial),从 Chrome 149 起可用。
如果应用需要登录,打开后先登录,再继续请求。如果智能体访问不到页面的工具,/webmcp 会在做出改变状态的界面编辑之前停下,而不是在页面上盲目乱点。
为什么这种模式很适合 Agent-Native 应用
当界面和智能体不再是修改应用的两种独立方式时,这套模式的价值会大得多。Agent-Native 就是这样设计的。它是我们开源的一套 TypeScript 框架,用来构建人和智能体可以协同操作的应用。开发者不用为界面写一套逻辑、再为智能体写另一套,而是定义双方都能使用的共享操作。
设想一个幻灯片编辑器,它有一个“更新幻灯片”的操作。你手动编辑幻灯片时,界面可以调用这个操作。页面也可以把同样的能力作为工具暴露给智能体。无论走哪条路,请求都会经过同一套应用逻辑。
在一个带身份验证的 Agent-Native 应用中,符合条件的后端操作会自动作为页面工具暴露出来。当智能体成功修改了内容,应用会刷新数据,结果会直接显示在你正在查看的界面上。
共享操作层才是关键。人和智能体不必仅仅因为交互方式不同,就各自维护一套应用版本。