Vercel News
WebMCP support now available in mcp-handler
8.5内容质量
TL;DR · AI 摘要
Vercel 的 mcp-handler 现已支持 WebMCP，允许通过简单脚本在浏览器中使用 MCP 工具。
核心要点
- 添加 experimental_webMcp 对象到 mcp-handler 配置以启用 WebMCP 支持
- 通过 ?webmcp-script 参数加载脚本实现浏览器端工具调用
- 升级到 [email protected] 可使用该功能
结构提纲
按章节快速跳转。
- §功能发布
宣布 mcp-handler 支持 WebMCP 标准
- ·实现方式
通过添加 experimental_webMcp 对象配置工具
- ›代码示例
展示如何在 route.ts 中注册工具
- ·使用方法
通过 ?webmcp-script 参数加载脚本
- ›认证机制
代理调用自动携带用户身份信息
- §升级指引
要求升级到 [email protected] 版本
思维导图
用一张图看清主题之间的关系。
查看大纲文本（无障碍 / 无 JS 友好）
- WebMCP支持
- 核心机制
- 脚本注入实现工具暴露
- 认证代理自动处理
- 实现步骤
- 配置experimental_webMcp对象
- 添加脚本参数加载
- 版本要求
金句 / Highlights
值得收藏与分享的关键句。
Add a single script tag to your site, and your existing MCP tools become available there too.
The script registers those tools with the page and proxies each call back to your MCP server as the signed-in user
Upgrade to [email protected] and read the documentation to get started.
#mcp-handler#WebMCP#Vercel#前端工具
打开原文mcp-handler 现已支持 WebMCP - Vercel
mcp-handler 现在已提供对 WebMCP 的实验性支持，这是用于向浏览器内代理暴露工具的提议 Web 标准。只需在您的网站中添加一个脚本标签，您现有的 MCP 工具即可在浏览器端使用。
通过将工具添加到 experimental_webMcp 对象中进行启用：
app/api/mcp/route.ts
code
import
{
createMcpHandler
}
from
"mcp-handler"
;
const
handler
=
createMcpHandler
(
(
server
)
=>
{
server
.
registerTool
(
"roll_dice"
,
/* ... */
)
;
}
,
{
experimental_webMcp
:
{
tools
:
[
"roll_dice"
]
,
}
,
}
,
)
;
export
{
handler
as
GET
,
handler
as
POST
}
;然后通过 ?webmcp-script 参数从您的 MCP 端点加载脚本：
code
<
script
src
=
"
/api/mcp?webmcp-script
"
>
</
script
>该脚本会将这些工具注册到页面中，并将每个调用代理回您的 MCP 服务器，以已登录用户的身份进行，因此认证工具无需浏览器端的 OAuth 流程即可工作。
升级到 [email protected] 并阅读文档以开始使用。