// W3C WebML Community Group 提案
// Chrome 146 DevTrial (Microsoft + Google 联合推动)
if ('modelContext' in navigator) {
navigator.modelContext.registerTool({
name: 'addToCart',
description: '将当前商品加入购物车',
inputSchema: {
type: 'object',
properties: {
quantity: { type: 'number' }
},
required: ['quantity']
},
handler: async ({ quantity }) => {
return cart.add(currentProduct, quantity);
}
});
}
运行位置
浏览器页面内 — 前端 JS 注册 tool，Agent 直接发现调用
特点
■声明式工具注册 — registerTool() 注册 MCP 工具函数，Agent 自动发现
■共享页面上下文 — 登录态、个性化数据、应用状态天然共享
■浏览器安全模型 — 权限提示 + 跨域隔离 + 用户可控
场景
▶电商 — 加购、比价、下单，Agent 直接调用页面已有的业务函数
▶SaaS / 内部系统 — 表单填写、数据查询、流程审批，复用前端逻辑
▶内容平台 — 搜索、筛选、收藏，在用户已登录的上下文中操作