WebMCP：让 AI Agent 像调用本地函数一样操作 Web 应用

什么是 WebMCP？

WebMCP (Web Machine Learning Model Context Protocol) 是由 Web Machine Learning 社区小组提出的一个新 JavaScript 接口。它的核心目标是：允许 Web 开发者将其应用程序的功能暴露为“工具（Tools）”。

这些工具带有自然语言描述和结构化架构，可以被浏览器内置的 AI 代理（Agents）、外部 AI 平台或辅助技术调用。

你可以将使用了 WebMCP 的页面看作是一个客户端的 MCP 服务器。它不需要后端中转，直接在浏览器环境内实现逻辑，让用户和 AI 代理能够在同一个 Web 界面中协同工作。

核心术语定义

在深入 API 之前，我们需要了解几个基本概念：

代理 (Agent)：能够理解用户目标并代表用户采取行动的自主助手。
浏览器代理 (Browser’s Agent)：由浏览器直接提供或通过插件托管的 AI 代理。
AI 平台 (AI Platform)：如 OpenAI (ChatGPT)、Anthropic (Claude) 或 Google (Gemini) 等提供代理服务的平台。

API 概览

WebMCP 主要通过扩展浏览器的 navigator 对象来实现。

1. 扩展 Navigator 接口

规范在 Navigator 上增加了一个只读属性 modelContext：

// 检查浏览器是否支持
if ('modelContext' in navigator) {
  const mc = navigator.modelContext;
}

2. ModelContext 接口

这是管理工具的核心接口，提供了注册、注销和清理工具的方法：

provideContext(options)：向浏览器注册一组上下文（工具）。
registerTool(tool)：注册单个工具。
unregisterTool(name)：移除特定名称的工具。
clearContext()：清除所有已注册的工具。

3. 定义一个工具 (ModelContextTool)

一个工具包含以下核心要素：

name: 唯一标识符。
description: 用自然语言描述工具的功能（帮助 AI 理解何时使用它）。
inputSchema: 使用 JSON Schema 定义的参数结构。
execute: 当 AI 调用该工具时触发的 JavaScript 回调函数。

代码示例：注册一个简单的记事本工具

navigator.modelContext.registerTool({
  name: "add_note",
  description: "在当前网页的笔记本中添加一条新笔记",
  inputSchema: {
    type: "object",
    properties: {
      content: { type: "string", description: "笔记内容" }
    },
    required: ["content"]
  },
  execute: async (input, client) => {
    // 这里的逻辑运行在网页的 JS 环境中
    const result = myApp.saveNote(input.content);
    return { status: "success", noteId: result.id };
  }
});

用户交互与安全

WebMCP 特别考虑了用户控制权。

通过 ModelContextClient 接口，开发者可以在工具执行过程中请求用户交互。例如，当 AI 试图执行一个敏感操作（如删除数据或下单）时，网页可以弹出一个确认框。

execute: async (input, client) => {
  // 请求用户确认操作
  const confirmed = await client.requestUserInteraction(async () => {
    return await showCustomConfirmModal("你确定要让 AI 执行此操作吗？");
  });

  if (!confirmed) throw new Error("用户取消了操作");
  // 继续执行...
}

为什么这很重要？

目前的 AI 代理通常通过网页抓取（Scraping）或模拟点击来与网页交互，这种方式既不稳定也不安全。

WebMCP 的优势在于：

语义化：通过 description 告诉 AI 每个功能的真实意图，而非让其盲目猜测。
高效性：直接调用 JS 函数，数据格式严谨，响应速度快。
隐私与安全：逻辑保留在客户端，且开发者可以细粒度地控制哪些功能暴露给 AI。

结语

WebMCP 标志着 Web 应用从“仅供人类消费”向“人类与 AI 共同消费”的转变。随着浏览器对 AI 能力的进一步集成，这种声明式的工具调用方式将成为未来 Web 开发的标准配置。

注：本文基于 2026 年 2 月 12 日的草案版本编写，API 细节可能会随规范演进而变化。