ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

3分钟上手MidScene.js:自然语言控制浏览器,不用写一行代码

3分钟上手MidScene.js:自然语言控制浏览器,不用写一行代码 3分钟上手MidScene.js自然语言控制浏览器不用写一行代码【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene早上十点运营同事还在后台逐个填活动表单一填就是两小时错一行还得重来。这类重复的网页操作现在交给 AI 浏览器自动化 就行你在 MidScene.js 里输入一句把列表里的商品逐个加入购物车它自己看页面、找按钮、完成操作。MidScene.js 是一个开源的 GUI Agent 项目主打用自然语言控制浏览器和移动设备把原本要写脚本的活儿变成说人话。定位一句话看截图干活的 AI 网页操作工具MidScene.js 的定位很简单面向 E2E 测试和日常 UI 自动化靠纯视觉工作。它不读 DOM、不维护选择器元素定位完全基于页面截图——只要人眼能看见它就能点到包括纯图标按钮、canvas 画布里的控件、跨域 iframe。说白了过去写三行 Playwright 还能搞定的事现在说句人话就行页面一改版传统选择器集体阵亡而它的指令一个字不用改。5分钟跑起来环境准备与第一条指令先准备环境需要 Node.js 18仓库本身按 Node 20/22 构建建议直接用 20 以上。克隆并安装依赖git clone https://gitcode.com/GitHub_Trending/mid/midscene cd midscene pnpm install浏览器方向最快的体验路径是装 Chrome 扩展在 chrome://extensions 打开开发者模式加载已解压扩展选择项目里的 apps/chrome-extension 目录装完后工具栏会出现 MidScene.js 图标在扩展面板里配置好模型即可。配置完成后在 Prompt 框输入第一条自然语言指令类型选 Action点 Run打开 ebay 首页在搜索框输入 headphones点击搜索按钮右侧浏览器会实时执行每一步的操作结果都有截图留档。跑通这条指令你就完成了从无代码网页自动化到真实执行的全流程后面玩什么都是在这条路上加料。它能做什么运营、测试、开发三种视角运营视角监控与数据搬运。场景示例是盯竞品价格依次访问京东、天猫、苏宁的 iPhone 商品页记录价格、促销信息和库存状态整理成对比表格验证方法看执行报告里每个站点生成的截图确认价格字段都有抓到没抓到的步骤会明确标红。⚠️ 批量跑的时候记得在指令里加每次操作间隔 2 秒避免触发反爬。测试视角回归验证。写一句断言级指令比如提交空表单后页面应显示必填项校验提示。MidScene.js 的 aiAssert 校验的是用户真实看到的东西——颜色、高亮、文案、布局而不是 DOM 节点存不存在。验证方法跑完看自动生成的 HTML 报告断言失败会附失败时刻的截图。开发视角把脏活外包。让它在 Playwright/Puppeteer 流程里承担定位和交互你只管编排aiAct执行操作、aiQuery提取数据、aiAssert做断言方法都收在同一套 SDK 里。验证方法直接在你的 Vitest 或 Playwright 用例里跑一遍测试日志和报告自动落盘不用额外搭。它怎么做到三个要点加人话类比视觉模型当眼睛。背后是 UI-TARS、Qwen2.5-VL 这类多模态模型分析页面截图识别按钮和输入框的位置与功能。类比就像你眯着眼看一张手机照片照样能分清哪里是支付按钮。任务规划当大脑。一条购买指定商品的指令会被拆成打开页面、搜索、选规格、加购、结算等子步骤逐步执行每步都有规划、定位、动作三个环节。类比跟实习生交代订张去北京的票他会自己拆成打开 12306→输日期→选票→付款。统一控制接口当手。Web、Android、iOS、HarmonyOS、桌面应用走同一套 API底层差异被屏蔽桥接模式下还能接管你已经登录的 Chrome直接复用你的登录态和 cookie。类比一根 HDMI 线接不同品牌的显示器你只管发指令不用关心背后插的是什么。从单任务到批量跑录制重放、批量与定时录制重放。用 Chrome 扩展的录制功能操作一遍页面扩展会把你点过的步骤转成可编辑的自然语言指令序列改完直接重放。适合先把一次性的手工流程固化下来。批量任务。复杂流程更适合写成 YAML 脚本仓库里 示例脚本 就是现成的参考一个目录就是一组同类任务支持多文件并行执行结果统一出报告。定时执行。Linux 用 cron、Windows 用任务计划程序凌晨 3 点触发一条批量命令行业数据自动采完、报告自动生成全程无人值守。这里有个坑定时任务跑的环境要配好模型密钥建议先手动跑绿一次再交给定时器。你可能想问问本地必须配 GPU 吗不用。模型走云端 API 调用即可普通电脑跑着没问题如果数据敏感也可以自托管开源模型文档里有模型配置一节。问页面改版了指令会不会失效选择器那套会它不会。它看的是截图只要改版后搜索框还长那样指令照常生效这也是它维护成本低的核心原因。问只能做点选这类简单动作吗不是。条件判断、循环、多步业务流都能通过多步指令编排复杂流程建议拆成 YAML 脚本管理单条指令保持原子化成功率更稳。下一步文档、示例与反馈入口现在就可以去把扩展装起来跑通第一条指令再挑一个你每周都要手工重复的流程录下来。完整使用指南在 官方文档现成场景脚本在 示例脚本遇到问题或想提功能建议直接提交 Issue想动手改代码先看 CONTRIBUTING。【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表