为了应对这一挑战,WebMCP(Web模型上下文协议)应运而生,它提供了一种全新的解决方案,让AI能够更高效、更直接地与网页交互。 WebMCP是WebAPI的一个新提案,它提出了一种新的Javascript接口,允许Web开发人员将Web应用的功能以“tools”的形式公开,从而可以被AI agent、浏览器助手等调用。 使用WebMCP的网页可以被视为MCP服务器,浏览器支持在客户端脚本中实现工具,降低了后端服务开发维护成本。 在这样的背景下,高德开放平台JS API结合浏览器这一新特性,推出支持WebMCP的搜索插件,用户调用AMap.PlaceSearch即可拥有被AI调用的新能力。 WebMCP正在重新定义AI与网页交互的方式,它通过结构化数据交互和直接功能调用,极大提升了效率和稳定性。高德开放平台推出的搜索插件是一个典型的应用案例,展示了WebMCP在实际场景中的巨大潜力。
只需 50 行代码:WebMCP 全解析 想让 AI 助手与您的 Web 应用(前端界面/web网站)实现无缝交互,不再依赖屏幕抓取或视觉解析? 本篇博客将带你从原理到实战,深度剖析如何使用 WebMCP(又名 MCP-B)在几分钟内让站点 AI 化。 猫头虎fork仓库:https://github.com/MaoTouHU/WebMCP 什么是 MCP?为什么要支持 MCP? WebMCP 核心特性概览 零配置:无需 API 密钥、OAuth,全靠浏览器原生安全模型 轻量级:前端直接注册 MCP Server,50 行代码搞定 高性能:不做 DOM 视觉解析,调用速度更快 跨应用联动 开发、贡献与路线图 开发 git clone https://github.com/MaoTouHU/WebMCP.git cd WebMCP pnpm install pnpm dev 猫头虎
而 WebMCP 只能操作"支持 WebMCP"的网站。 WebMCP 解决方案: <! 方式三:webmcp.dev(快速测试) 步骤: # 安装 npm install @jason.today/webmcp # 启动 WebSocket 服务 npx webmcp-server # 可能的路径: 2026 年:WebMCP 发布 ↓ 头部网站开始适配 ↓ AI Agent 优先使用支持 WebMCP 的网站 ↓ 2028 年:WebMCP 成为标配? 我的看法 WebMCP 是一个有前景但不成熟的技术。
WebMCP 简单实现这里的实现包括:使用 WebSocket 协议来与客户端进行实时通信。在服务器端,通过 AI 助手(例如使用一个简单的 API 调用或者集成 AI 服务)进行交互。 charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>WebMCP
我们完成了基于华为开发者空间云开发环境(容器)探索前端智能化,后续待 OpenTiny 开源 WebAgent 实现,我们再分享基于 OpenTiny Next 的企业智能前端解决方案,我们相信以生成式 UI 和 WebMCP