🔍Midscene 官方介绍
📦 官方信息
| 项目 | 地址 |
|---|---|
| 官网 | https://midscenejs.com |
| GitHub | https://github.com/web-infra-dev/midscene |
| npm | @midscene/web |
| Discord | https://discord.gg/2JyBHxszE4 |
| X (Twitter) | @midscene_ai |
🎯 什么是 Midscene？
Midscene 是由 字节跳动（web-infra-dev 团队）开源的 AI 驱动的视觉化 UI 自动化工具。
"AI-powered, vision-driven UI automation for every platform."
核心理念： 用自然语言描述你的目标，Midscene 通过视觉语言模型自动规划并操作 UI------无需写代码、无需 DOM 定位，仅依靠截图即可完成自动化。
✨ 核心特性
🤖 自然语言驱动
- 用自然语言描述目标和步骤，Midscene 自动规划并操作 UI
- 支持 JavaScript SDK 或 YAML 编写自动化脚本
📱 全平台覆盖
| 平台 | 集成方式 |
|---|---|
| Web | Puppeteer / Playwright / Bridge Mode |
| Android | JavaScript SDK + adb |
| iOS | JavaScript SDK + WebDriverAgent |
| 桌面应用 | midscene-pc (Windows/macOS/Linux) |
| HarmonyOS | 支持 |
| 任意界面 | JavaScript SDK 自定义集成 |
🔬 纯视觉定位
- 不依赖 DOM：元素定位完全基于截图，由视觉语言模型（VLM）驱动
- Token 消耗降低约 80%，成本更低、速度更快
- 支持跨平台：浏览器、移动端、桌面 App、甚至 Canvas 元素
🛠️ 开发者友好
- 三类 API：交互 API、数据提取 API、工具 API（如 aiAssert(), aiLocate(), aiWaitFor()）
- MCP 集成：可将 Midscene 的原子操作暴露为 MCP 工具，供上层 Agent 调用
- 缓存回放：使用缓存快速回放脚本
- 调试工具：可视化回放报告、内置 Playground、Chrome 扩展
💡 支持的视觉模型
| 模型 | 推荐度 | 特点 |
|---|---|---|
| Doubao Seed | ⭐⭐⭐⭐ | UI 规划和定位能力强，速度稍慢 |
| Qwen3-VL | ⭐⭐⭐⭐ | 阿里开源，能力强 |
| Gemini-3-Pro/Flash | ⭐⭐⭐ | Google 模型，价格较高 |
| UI-TARS | ⭐⭐ | 开源，可自托管，探索能力强 |
| GLM-4.6V | 新集成 | 智谱开源，HuggingFace 可下载权重 |
🎬 使用场景展示
🌐 Web 自动化
"Sign up for GitHub, pass the form validation"
自动填写 GitHub 注册表单并通过所有字段验证
📱 iOS 自动化
"Open Twitter and auto-like the first tweet by @midscene_ai"
自动打开 Twitter 并点赞指定账号的第一条推文
🤖 Android 自动化
"Open Booking App, search for a hotel in Tokyo for four adults on Christmas, with score 8+"
自动打开 Booking App，搜索圣诞节东京四人大床酒店，评分 8 分以上
💻 PC 桌面自动化
"Open Sauce Demo e-commerce site, login and add items to cart"
自动打开电商网站、登录、添加商品到购物车（Windows/macOS/Linux 全支持）
🔧 MCP 集成
"Use GitHub MCP to check if latest Midscene commit has released a version, if not, invoke Midscene MCP to navigate to action page and run release"
Midscene 作为 MCP Server，被上层 Agent 调用来操作 UI
🦾 社区扩展
社区开发者已成功将 Midscene 与机械臂 + 视觉 + 语音模型结合，用于车载大屏测试场景
🚀 快速上手
零代码体验
-
：安装扩展，直接在浏览器中使用
- Android/iOS Playground：内置可视化工具控制本地设备
代码接入
# 安装
npm install @midscene/web
Web 示例（Playwright）：
import { pdd, aiQuery, aiAssert } from '@midscene/web/pdd';
async function run() {
await pdd.goto('https://github.com/login');
// 用自然语言描述操作
await aiQuery('Fill in the username and password, then click sign in', {
username: 'your-username',
password: 'your-password'
});
// AI 断言验证结果
await aiAssert('The page shows the user avatar in the top right corner');
}
🆚 对比传统 UI 自动化
| -- | 传统自动化 (Selenium/Appium) | Midscene |
|---|---|---|
| 定位方式 | CSS/XPath 选择器 | 纯视觉 + 自然语言 |
| 维护成本 | 高（UI 变则挂） | 低（视觉理解更鲁棒） |
| 跨平台 | 需分别适配 | 统一方案，所有平台 |
| 学习成本 | 需要了解 DOM 结构 | 自然语言描述即可 |
| Token 消耗 | N/A | 减少约 80% |
总结： Midscene 是一个视觉驱动的 AI UI 自动化工具，用自然语言就能控制 Web、iOS、Android、桌面应用等任意界面，特别适合自动化测试、 RPA、Agent 工具开发等场景。