尧图网站设计 尧图网站设计YAOTU DESIGN
ARTICLE DETAIL

资讯详情

深耕网站设计与一线实操的经验洞察。

BrowserSkill截图指南:视口、元素、整页3种模式与参数速查表

BrowserSkill截图指南:视口、元素、整页3种模式与参数速查表 BrowserSkill截图指南视口、元素、整页3种模式与参数速查表【免费下载链接】BrowserSkillLet AI agents use your real, logged-in browser without interrupting your work. CLI extension for browser automation across any shell-capable AI agent.项目地址: https://gitcode.com/GitHub_Trending/br/BrowserSkillBrowserSkill是一个让 AI 智能体直接操控你已登录真实浏览器的浏览器自动化工具由命令行 CLIbsk 浏览器扩展组成。其中的BrowserSkill 截图能力bsk screenshot命令支持视口、元素、整页 3 种模式一条命令即可导出 PNG。本文给出这 3 种模式的完整用法与参数速查表帮助你 5 分钟上手。一、开始之前确认浏览器已连接使用截图功能前需要安装 CLI 并让浏览器扩展连上本地 daemon。连接成功后扩展 popup 会显示已连接 / READY状态如官方商店页面所示快速检查三步bsk doctor # 诊断环境按提示修复 bsk status # 查看 daemon 状态 bsk session list # 查看可用会话截图命令需要 --session 所有截图命令都需要一个处于活跃状态的 session ID这是最常用的参数。二、3 种截图模式快速上手模式命令要点适用场景️ 视口截图不带额外参数截取当前可见区域最简单、速度最快 元素截图--ref eN裁剪截取指定 DOM 元素或 Canvas 区域 整页截图--full-page自动从顶部滚动到底部拼接完整长图三种模式的典型命令bsk screenshot --session id --out viewport.png bsk screenshot --session id --ref e3 --out element.png --json bsk screenshot --session id --full-page --out page.png视口模式省略--out时文件自动保存到临时目录$TMPDIR/bsk-screenshot-时间戳.png。元素模式--ref的值如e3来自最近一次bsk observe或bsk snapshot分配的引用号--json会额外输出图片宽、高、字节数。整页模式命令会滚动页面并自动恢复原来的滚动位置和样式不会打乱你正在看的页面。三、参数速查表以下对照 screenshot.rs 中的 CLI 定义整理参数模式默认值说明--session全部必填会话 ID必须处于活跃状态--tab-id全部Agent Window 当前活动标签页指定目标标签页不改变当前选中状态--ref元素无eN引用裁剪到对应 DOM 元素或 Canvas 区域--full-page整页关闭滚动整页并拼接长图与--ref互斥--scope整页followfollow跟随追加内容current只截初始文档高度--timeout整页2m抓取与编码超时支持30s、5m等写法--out全部临时目录输出 PNG 路径已存在则覆盖全局参数同样适用--json输出机器可读 JSON、--quiet、-v详细日志。--scope怎么选follow默认页面持续追加内容如信息流、聊天窗口时会一直滚动到没有新内容为止。current在初始文档高度处停下。即使底部还显示加载指示器也只截已加载部分——此时应如实说明只截取了当前已加载范围而不是宣称截全了整个列表。四、整页截图的注意事项整页模式功能强大但有几条限制值得提前知道详见 SKILL.md 的 Screenshots 章节需要活动标签页整页截图要求目标标签页处于活动状态普通视口截图则支持后台标签页配合--tab-id。不支持的页面类型浏览器内部页面、应用商店页面、嵌套滚动面板、虚拟滚动列表。失败不产生残缺文件捕获采用分块传输 原子写入write_full_page 实现中断后不会留下半截 PNG。loading_stalled报错表示页面底部 30 秒没有新增高度但一直显示加载中此时加大--timeout也没用。保持标签页可见page_hidden属于环境中断user_cancelled表示用户手动停止了捕获。五、进阶用截图里的坐标点击 Canvas 图形普通视口截图只出图而元素截图--ref指向 Canvas还会返回一个一次性capture_id。AI 智能体可以基于截图中的原始 PNG 坐标回点图形上的任意位置bsk click e3 --capture capture-id --image-x 42 --image-y 18 \ --session id注意capture 仅限一次使用、2 分钟内有效重新observe/snapshot或对同一元素再次截图都会使其失效。协议细节见 tool_screenshot_result.json。六、常见问题排查现象处理方式--full-page和--ref同时传了两者互斥二选一--timeout/--scope单独使用报错这两个参数只在整页模式生效需搭配--full-pageextension did not acknowledge --scope current扩展版本过旧需同步更新 CLI 与扩展图片拿到了但不能做 Canvas 点选capture_unavailable表示图片仅可查看需重新 observe 截图后再点击总结BrowserSkill 截图功能覆盖了三档常见需求视口最快、元素最精准、整页最完整。记住核心速查——--session必填、--ref配元素、--full-page配--scope/--timeout、--out控制输出路径基本就能覆盖日常所有场景。配合bsk observe/bsk snapshot获取的eN引用号还能进一步实现看图点图的 Canvas 交互是 AI 浏览器自动化工作流里视觉取证的基础能力。【免费下载链接】BrowserSkillLet AI agents use your real, logged-in browser without interrupting your work. CLI extension for browser automation across any shell-capable AI agent.项目地址: https://gitcode.com/GitHub_Trending/br/BrowserSkill创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表