现在谁还手动操作浏览器,应该学会让AI做你自己的打工人,释放自己的双手去,你的手应该是用来摸鱼而不是做这些费时并且无聊的操作
地址:https://mp.weixin.qq.com/s/zdbqsA9YdUlbpzPFnjmR-w
现在我们只需要通过人类的语言也就是自然语言告诉AI,帮我发一条微博,采集周杰伦演唱会的信息,并且写入到Google Docs
中,AI就会进行类似RPA的操作,在浏览器中点击、输入、提取数据,甚至生成可视化报告
复盘每一步操作,不需要我们写代码,也不需要一步步配置PRA,只需要一句话就可以实现,这就是Midscene.js
任何人都可以通过自然语言操控网页,无论是正常需要处理一些批量的网页操作,还是需要进行一些自动化测试,写Python代码或者设置RPA就太low了,太没效率了,Midscene.js
轻松搞定,重点是完全开源
。
不用写一行代码!直接用你自己的语言告诉 Midscene.js 你想做什么:
“在豆瓣搜索《流浪地球 2》并提取评分”
“登录淘宝,把购物车前 3 件商品加入收藏”
“监控某电商页面价格,降价 10% 立即通知我”AI 会自动解析指令、规划操作步骤,像真人一样点击按钮、填写表单、抓取数据,甚至支持复杂的逻辑判断(比如 “如果页面出现错误提示,就重试 3 次”)。
除了支持 GPT-4o、Claude 等通用大模型,Midscene.js 特别适配了两款专为 UI 自动化设计的开源模型:
UI-TARS:可以私有化部署,让本地私人数据更安全,并且对网页元素的识别准确率高达 98%,这个我就不多介绍了,前面的文章已经写过了,大家可以看看以往的文章
Qwen2.5-VL(千问):中文场景优化,对一些复杂表格、弹窗处理能力更加强大,并且完全免费且支持商业使用。
如果不想依赖闭源模型,这两个开源模型都可以满足需求
作为前端,在我们以前常用的Puppeteer/Playwright
可以通过API调用,直接与以前编写的自动化脚本无缝衔接,例如先用 AI 定位到网页元素,再使用 Playwright 执行批量点击操作
日常使用(摸鱼使用🤫) 使用Chrome
插件,一键安装,不用配置环境,打开浏览器直接使用
Chrome插件使用:https://midscenejs.com/quick-experience.html
开发自动化脚本的时候最头疼就是调试了,每一步都要调试一下,效率太低。 Midscene.js可以直接生成HTML 报告,每一步点击、输入都能动态回放,哪一步出错都可以一目了然,而且首次执行任务后可以自动保存操作流程,下次相同的任务可以直接复用,这不大大提升了效率,有了更多摸鱼的时间
对 Midscene.js 说:“用 Chrome 打开 Twitter,发布一条图文 tweet,内容是‘今天发现了超好用的 AI 工具!’,并附上项目官网链接和一张猫咪配图。”
AI 自动登录账号→点击发推按钮→输入文本→上传图片→点击发布,全程无加速视频如下,真的是零代码进行操作
搜集周杰伦演唱会信息并写入 Google Docs?
// 用Midscene.js API编排任务
const midscene = require('midscene');
const browser = await midscene.launch({ headless: false });
const page = await browser.newPage();
// 让AI搜索演唱会信息
const concertData = await midscene.operate(page, "搜索‘周杰伦2025演唱会行程’,提取举办城市、日期和票价范围,保存为JSON。");
// 写入Google Docs
await midscene.operate(page, `打开Google Docs,新建文档,标题为‘周杰伦演唱会信息’,内容写入: ${JSON.stringify(concertData)} `);
await browser.close();
AI 能够自动完成 “搜索→解析表格→提取数据→生成文档” 全流程,这不比手写脚本快多了!
不分你是高手还是新手,这三种方式绝对好用
安装插件:打开 Chrome 应用商店,搜索 “Midscene.js” 或点击这里安装;
启动 AI 助手:打开任意网页,点击插件图标,输入自然语言指令(比如 “提取这个网页的所有链接”);
查看结果:右下角弹出操作报告,支持导出 JSON 数据或直接复制结果。
比较适合有一些需要批量执行较为复杂的任务场景,例如电商价格监控:
# price-monitor.yaml
steps:
- name: 打开商品页面
action: navigate
url: https://www.example.com/product/123
- name: 提取价格
action: extract
target: ".price-tag" # 支持CSS选择器或自然语言描述(如“页面右上角的价格数字”)
- name: 比较价格
action: assert
condition: "当前价格 < 1000元"
onFail: "发送邮件通知用户价格过高"
保存后运行 midscene run price-monitor.yaml
,AI 会按步骤执行并生成调试报告。
如果你熟悉自动化测试工具,可通过 NPM 安装 Midscene.js:
npm install midscene
然后在代码中调用:
const { Midscene } = require('midscene');
const midscene = new Midscene({ model: 'UI-TARS' }); // 使用开源模型
const browser = await midscene.launchPuppeteer();
const page = await browser.newPage();
// 让AI操作页面
await midscene.operate(page, "在搜索框输入‘Midscene.js’,点击搜索按钮,等待结果加载完成。");
// 后续可结合Puppeteer API进一步处理
const results = await page. $ $eval('.search-result', elements => elements.map(e => e.textContent));
console.log(results);
AI 负责 “理解指令 + 定位元素”,你负责 “编写逻辑 + 拓展功能”!
特性 | 传统 UI 自动化工具(如 Selenium) | Midscene.js |
---|---|---|
上手难度 | 需要掌握编程语言和元素定位 | 自然语言直接输入,0 代码基础 |
模型适配 | 依赖人工编写脚本 | 内置 AI 模型自动规划操作流程 |
调试体验 | 日志复杂,需手动排查错误 | 可视化操作回放 + 自然语言断言 |
数据安全 | 闭源模型可能上传敏感数据 | 支持开源模型私有化部署 |
灵活性 | 固定脚本,修改成本高 | 动态解析指令,支持实时调整 |
简单来说:传统工具是 “你写脚本让电脑执行”,Midscene.js 是 “你告诉 AI 要做什么,AI 帮你写脚本并执行”,AI不会淘汰你,淘汰你的是会用AI的人
扫码关注腾讯云开发者
领取腾讯云代金券
Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号:粤B2-20090059 深公网安备号 44030502008569
腾讯云计算(北京)有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287
Copyright © 2013 - 2025 Tencent Cloud.
All Rights Reserved. 腾讯云 版权所有