ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

dev-browser 完整指南:Claude Code 浏览器自动化 3 种实现方式

dev-browser 完整指南:Claude Code 浏览器自动化 3 种实现方式 dev-browser 完整指南Claude Code 浏览器自动化 3 种实现方式【免费下载链接】dev-browserA Claude Skill to give your agent the ability to use a web browser项目地址: https://gitcode.com/gh_mirrors/dev/dev-browser让 Claude Code「去那个页面点一下这个按钮」时智能体往往只能输出一份手动操作步骤。dev-browser是一个面向 Claude Code 的浏览器自动化Skill装上之后AI 能直接操作真实浏览器完成点击、输入、截图、读取页面内容这类动作。底层是完整的PlaywrightAPI你或 AI 写几行 JavaScript它就在本地沙箱里驱动页面。下文先带你把环境跑起来再看几种常见用法。它解决了什么最直接的收益是智能体有了「手」。过去让 AI 处理网页任务它给你步骤、你手动点现在你一句「打开登录页检查表单的错误提示」它能自己跑完并把结果带回来。更关键的是状态可以保留。命名页面在多次脚本之间持续存在登录一次后续脚本接着用同一个页面cookie 和登录态都不会丢。多步流程提交 → 确认 → 看结果才能像真人浏览器会话一样走通而不是每次开一个全新页面重来。另一层考虑是安全。脚本不在你的系统里执行而是跑在QuickJS WASM沙箱中没有宿主文件系统和网络访问。这也是为什么 Claude Code 可以把dev-browser直接加进权限白名单——智能体拿到了浏览器操作自由却碰不到宿主机。快速体验整个过程几分钟就能走完 ⚡ 先安装命令行和配套的 Chromium这是唯一一步「重」操作。npm install -g dev-browser dev-browser install然后跑一个 headless 脚本验证环境访问一个页面把标题打印出来。dev-browser --headless EOF const page await browser.getPage(main); await page.goto(https://example.com, { waitUntil: domcontentloaded }); console.log(await page.title()); EOF如果你想在 Claude Code 里使用它安装内置 skill让智能体认识这条命令。dev-browser install-skill --claude不想新开浏览器的话也可以直连正在运行的 Chrome先在chrome://inspect/#remote-debugging开启远程调试再给命令加上--connect即可智能体随即能用上你浏览器里现成的登录态。架构一览项目分为三层Rust命令行负责交互Node.js守护进程管理浏览器沙箱执行脚本。几个值得知道的入口cli/src/main.rs — 命令行入口接收脚本与参数和本地守护进程通信。daemon/src/daemon.ts — 守护进程主循环负责请求解析、脚本调度和空闲浏览器回收。daemon/src/browser-manager.ts — 管理命名浏览器实例覆盖新启动 Chromium 和连接现有 Chrome 两条路径。daemon/src/sandbox/ — QuickJS WASM 沙箱与脚本执行逻辑Playwright 调用在这里被中继到真实浏览器。实战场景验证本地前端改动是最高频的用法起一个本地开发服务器让智能体访问页面、点一遍主流程、最后存一张截图。回归验证从此有了「眼睛」改了个按钮样式导致错位它看得出來。数据提取依赖持久页面第一个脚本打开页面并完成导航后面的脚本提取内容、把截图存到~/.dev-browser/tmp/全程不需要重复登录。想让智能体操作你日常在用的浏览器时直接用--connect接入即可不用再把登录态、cookie 讲给它听。作者公开的评测里dev-browser 用 3 分 53 秒、29 轮对话、0.88 美元的成本完成了同一组任务成功率 100%耗时和花费都低于 Playwright MCP 与 Chrome 扩展方案。你可能想知道关于浏览器兼容目前主要支持 Chrome、Edge、Brave 这类 Chromium 内核浏览器要连接已有的 Chrome 实例需要按前文提到的方式开启远程调试。关于权限提示因为脚本被限制在沙箱内可以把Bash(dev-browser *)写进 Claude Code 的settings.json允许列表之后就不用每次确认了。关于选型时机如果你要让 AI 跑真实的浏览器任务并且在意成本和对话轮数它是目前比较扎实的选择之一如果只是自己写 Playwright 脚本倒不必额外引入它。项目仍在持续迭代遇到 bug 或想提功能可以从 CONTRIBUTING.md 入手维护者建议先开 issue 再动手。【免费下载链接】dev-browserA Claude Skill to give your agent the ability to use a web browser项目地址: https://gitcode.com/gh_mirrors/dev/dev-browser创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表