Bun 1.4 WebView：为 Claude Code 提供轻量级浏览器自动化 JSON API

Bun 1.4 的 Bun.WebView：构建一个类 shot-scraper 的 JSON API 给 Claude Code 使用

Bun 1.4 的 Bun.WebView 可以实现一个 192-256MB 的浏览器自动化 JSON API（shot-scraper 风格）。用它来为 Claude Code 提供网页抓取和 JS 执行能力，而无需引入沉重的 Playwright 开销。

Bun 1.4 于今天发布，这是一个大版本。期待已久的 Rust 重写终于来了，但被一大堆新功能淹没了：Bun.Image、Bun.markdown、Bun.cron()、bun run --parallel 等等。对 Claude Code 用户来说，最亮眼的是 Bun.WebView —— 内置于 Bun 核心的头等浏览器自动化能力，基于 macOS WebKit 或通过 Chrome DevTools Protocol（CDP）调用本地 Chromium。

Simon Willison 立刻将其投入测试：他让 Claude Code 为他构建了一个受 shot-scraper javascript 工具启发的原型 JSON API。结果如何？一个 TypeScript 服务器，加载页面、执行 JavaScript 并返回结果 —— 全部在一个 192MB-256MB 的容器中完成。

这对你意味着什么

如果你曾经想让 Claude Code 抓取动态页面、渲染 SPA、或执行基于浏览器的断言，你可能用过 Playwright 或 Puppeteer。那些都很重 —— 一个完整的 Chromium 实例轻松吃掉 500MB+。Bun.WebView 的方案将这一开销大幅降低：

• 复杂页面下完整 Chrome 仅需 192MB-256MB（通过 cgroups 测试）
• 原生 CDP 支持 —— 无需额外驱动或包装器
• macOS 上可选 WebKit，本地运行更轻更快
• 内置于 Bun 核心 —— 无需 npm install，不存在版本不匹配问题

这意味着你可以在一个微型容器中运行浏览器自动化服务，就在 Claude Code agent 旁边，不会让你的基础设施成本爆炸。

下面是入门方法：

安装 Bun 1.4：

curl -fsSL https://bun.sh/install | bash

（或 brew install bun）

克隆 Simon 的原型作为参考：

git clone https://github.com/simonw/research/tree/main/bun-webview-json-api
cd bun-webview-json-api
bun install

构建你自己的最小服务器 —— 核心模式很简单：

import { WebView } from "bun";

const server = Bun.serve({
  port: 3000,
  async fetch(req) {
    const url = new URL(req.url);
    if (url.pathname === "/scrape") {
      const target = url.searchParams.get("url");
      const script = url.searchParams.get("script") || "return document.title";
      const wv = new WebView({ url: target });
      const result = await wv.evaluate(script);
      return Response.json({ result });
    }
    return new Response("Not found", { status: 404 });
  },
});

将其接入 Claude Code —— 添加一个 MCP server 或使用 claude CLI 调用：

claude -p "Scrape https://example.com and extract all h2 headings" --tool "curl http://localhost:3000/scrape?url=https://example.com&script=return Array.from(document.querySelectorAll('h2')).map(h=>h.textContent)"

针对你的使用场景优化：

• 在 macOS 上用 WebKit 做开发/测试（启动更快）
• 生产环境用 Chromium 以获得完整兼容性
• 在容器中设置内存限制（从 256MB 起步，可向下调整）

专业技巧：将 Bun.cron() 结合使用，调度定期抓取任务并将数据反馈给 Claude Code 进行分析 —— 全部在一个 Bun 进程中完成。

为什么这對 Claude Code 很重要

Claude Code 擅长推理和代码生成，但它无法点击按钮或渲染 JavaScript。Bun.WebView 为你提供了一座通往浏览器的轻量桥梁，轻到可以作为 sidecar 服务运行。再也不需要为了检查一个页面是否加载成功而启动一个 1GB 的 Playwright 容器 —— 一个 192MB 的 Bun 服务就能搞定。

Simon 的原型只是开始。想象一下：

• 视觉回归测试 —— 捕获截图，与 Claude Code 的视觉能力进行比较
• 动态表单填充 —— 自动化复杂的多步网页流程
• SPA 抓取 —— 从需要 JavaScript 执行才能渲染的 React/Vue 应用中提取数据

Bun 1.4 让这些变得轻而易举。今天就试试吧。

Source: simonwillison.net

Originally published on gentic.news