首页 › new-tools › 网站即工具:WebMCP本周四把开源新刀

网站即工具:WebMCP本周四把开源新刀

2026 年 2 月,Chrome 把一个叫 WebMCP 的东西悄悄塞进了浏览器预览版。这可能是今年最被国内低估的一刀——它让任何一个网站,从"给人看的页面"变成"给 AI agent 调用的函数"。海外已经有四个新项目搭上了这班车,其中一个直接把 agent 操作网页的 token 成本砍掉了 90%。本周(2026-07-04)Hacker News 上它们集中刷屏,而国内技术圈几乎没人讨论。这篇就把这波"网站即工具"的新刀一次拆给你看,连同为什么现在是个窗口期。

先搞懂:WebMCP 到底改了什么

过去 agent 操作网页,靠的是"截图鬼循环":截图 → 模型看图猜 DOM → 点击/输入 → 再截图。这条路能跑,但 token 烧得飞起——一个复杂表单操作,动辄几十次往返,context window 直接爆炸。Playwright 和 Chrome DevTools MCP server 都是这套路子。

WebMCP 反过来:让网站主动把自己暴露成一组语义化"工具"(tools)。agent 不用看图、不用猜 DOM,直接像调 API 一样调网站能力。W3C 已经在推进这个提案,HN 上相关讨论热度极高——"WebMCP Proposal"153 分、"WebMCP is available for early preview"360 分,最直白的一条标题是"Google Chrome ships WebMCP, turning every website into a tool for AI agents"。

flowchart LR
    subgraph OLD["传统 Agent 操作网页(烧 token)"]
        A1[Agent 下指令] --> A2[CDP 截图]
        A2 --> A3[模型读图猜 DOM]
        A3 --> A4[点击/输入]
        A4 --> A2
    end
    subgraph NEW["WebMCP 新链路(省约 90% token)"]
        B1[Agent 调 list_website_tools] --> B2[网站返回语义工具列表]
        B2 --> B3[Agent 调 call_website_tool]
        B3 --> B4[网页内 JS 直接执行]
        B4 --> B5[返回结构化结果]
    end
    OLD -.token 爆炸/不确定.-> NEW

一句话总结信息差:国内还在卷 RPA + 截图 + DOM 解析,海外已经把"网站自带 API"做成了浏览器级标准。 下面四把新刀,就是这个新范式下的第一批落地工具。

第一把刀:Chrome DevTools MCP 的 WebMCP Fork(省 90% token)

这是本周性价比最高的一把。

第二把刀:Persona.js(让任何老站长出 agent 能力)

第三把刀:Routing24(WebMCP 实战样板工程)

光有库不够,得有真跑起来的产品给你抄代码。Routing24 就是那个样板。

第四把刀:WebMCP 标准本身(免费、浏览器内置)

为什么是"现在":经济顺风让这刀磨快了

光有标准不够,还得"跑得起"。本周 HN 首页一条 315 分的帖子给了答案——Performance per dollar is getting faster and cheaper(wafer.ai,2026-07-03)。核心数据:

这条对国内读者额外香:GLM 是国产模型,现在能以远低于 Blackwell 的成本、超高吞吐跑起来。便宜的 token × WebMCP(结构化、不烧截图)= 自主 web agent 第一次在经济上跑得通。这不是巧合,是两件事在 2026 年中撞在一起,撞出了窗口期。

信息差总结:你知道的 vs 别人已经干的

维度 国内主流认知(你在做的) 海外本周在做的(信息差)
agent 操作网页 截图 + DOM 解析 + 视觉模型 WebMCP:网站主动声明工具
token 成本 screenshot 循环,烧得肉疼 CDP WebMCP fork,砍掉约 90%
给网站加 agent 重写前端 + 搭后端 Persona.js,几行 JS 接入
SaaS 的 agent 化 表单进、报表出 Routing24:整个 app 变成 tool+state
推理成本 卷 NVIDIA,贵 GLM-5.2 on AMD,2x 更便宜

行动指南:本周就能做的四步

  1. 换掉你的 CDP MCP server:把 github.com/WebMCP-org/chrome-devtools-quickstart 装上,drop-in 替换。先在最高频的 agent web 任务上测 token 降幅,预计省 80%+。
  2. 给自己的产品加 Persona.js:挑一个内部工具或官网,加几十行 JS 暴露 2-3 个工具,让 Claude/Cursor 能直接驱动它。这是最低成本的"agent 化"试验。
  3. 抄 Routing24 的源码:重点看它怎么把 app 状态通过 window 结构化暴露给 agent。这是从"网页"升级到"可被 agent 驱动应用"的核心范式。
  4. 把推理切到 GLM-5.2 on AMD:通过 OpenRouter / Vercel AI Gateway 直连,对比你现在的 NVIDIA 方案成本。国产模型 + AMD 算力,是当前性价比最高的组合。

如果你只能做一件事:先做第 1 步。因为它是今天就能省钱的、可逆的、零成本的动作,跑通之后你自然会用新眼光看后面三步。

参考来源


本文由「51学通信」技术团队出品。51学通信由通信行业18年老兵爱卫生(微信ID: gprshome201101)维护。 聚焦5G/6G核心网、3GPP标准、AI工具实战。知识星球「51学通信」提供深度技术答疑和行业洞察。


完成摘要 - 数据采集:WebSearch/web_reader 工具本周配额耗尽(2026-07-18 重置),改用 curl 直连 HN Algolia API、Firebase HN API、Product Hunt RSS、目标站点,成功抓取本周(2026-07-04)最新数据。 - 核心发现:定位到本周最大信息差主题——WebMCP(Chrome 2 月已 ship,国内几乎无讨论),并串联四把落地新刀 + GLM-5.2 on AMD 的经济顺风。 - 产出:1 篇 Round 1「新工具首发」文章,约 2500 字,含 1 个 Mermaid 对比流程图、1 张信息差总结表、5 条可点击参考来源、品牌页脚。

下一步计划 - 若需 Round 2(隐藏技巧):可深挖 Persona.js 的 WebMCP 工具声明写法 + Claude Cowork 的 javascript_tool 用法,做一篇"5-8 个隐藏技巧"。 - 若需强化时效性:等 WebSearch 配额 7-18 重置后,可补充 Product Hunt 本周 AI 新品榜单交叉验证。 - 优先级建议:先用本文四把刀做实操(成本最低的是第 1 步换 CDP fork),实战数据可反哺后续 use-cases 文章。

注意事项 - WebMCP 仍处于 W3C 提案 + Chrome 预览阶段,正式版全面放开时间未定,接入时需以官方 flag 说明为准,避免在生产强依赖未稳定 API。 - GLM-5.2 on AMD 的具体价格请以 OpenRouter / Vercel AI Gateway 实时报价为准,文中"2x 更便宜"为 wafer.ai 基准测试结论。

[!tip] 51学通信知识星球 星主:爱卫生(微信:gprshome201101)——公众号「51学通信」创办者,19 年通信行业运维与讲师经验,著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书(各大电商平台有售)。 星球定位:深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域,主打运维岗位与信令分析。 当前规模:5200 篇主题 / 990 个回答,198 元/年。 加入福利:加入星球后请加爱卫生微信,拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题,另有群内分享。 AI 加持:51学通信知识星球已作为 skill 接入 WorkBuddy,使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例,做总结、找文档和 PPT 等场景全覆盖。

51学通信知识星球海报-扫码加入