一句话让浏览器自己动手——Midscene 浏览器自动化零代码上手
【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene
浏览器自动化过去是写脚本的工程师的活，普通人只能重复点点点。现在你只要打一句中文「填写账号密码并点击登录」，页面就会自己完成流程。Midscene 就是这样一个靠截图看懂界面、听完你的描述就代为操作的 AI 浏览器自动化工具。
🚀 跑起来：两分钟看到第一次执行结果
先确认机器上装了 Node.js 20.19+（或 22.12+）和 pnpm 9.3+，这个仓库用 pnpm 管理依赖，不建议用 npm。
把代码拉到本地并装好依赖：
git clone https://gitcode.com/GitHub_Trending/mid/midscene cd midscene && pnpm install后台把所有子包编译一遍，首次会跑几分钟，放着别动：
pnpm dev启动 Playground 并自动打开浏览器：
cd apps/playground && pnpm dev页面打开后，先在设置页填一个具备 UI 定位能力的多模态模型密钥，再打开任意网页输入第一句话，就能看到第一次执行结果。
它能干什么：Midscene 浏览器自动化能力全景
一句中文指令，让浏览器自动走完表单
① 你想干嘛：注册、登录这类要手动填的表单流程，不想自己点了。
② 你实际输入：在登录页输入「填写用户名和密码输入框，然后点击登录按钮」并运行。
③ 结果长什么样：页面自己填写、点击，你能看到每一步的截图和它的决策过程。
把页面上的商品和价格提取成 JSON
① 你想干嘛：把列表页的数据变成能直接用的结构化数据。
② 你实际输入：「获取页面中的商品，{name: string, price: number}[]」。
③ 结果长什么样：直接返回一个 JSON 数组，粘贴进表格或脚本就能用。
让 AI 替你检查界面显示对不对
① 你想干嘛：确认结果「看起来对」，而不是只确认按钮被点了。
② 你实际输入：「页面顶部显示导航栏，右上角显示当前用户名」。
③ 结果长什么样：AI 对照截图判断通过或失败，并给出理由。每次执行还会生成 HTML 报告，截图、操作轨迹和断言结果都在里面，出问题直接翻报告定位。
Midscene 移动端自动化：连上手机跑同一句指令
① 你想干嘛：同一句指令，希望真机上也能跑。
② 你实际输入：手机 USB 连接并开启 USB 调试后，在移动端 Playground 输入「打开购物应用，点击列表第一件商品」。
③ 结果长什么样：手机画面实时镜像到电脑，操作自动完成，报告和 Web 端一样生成。
🔧 上手技巧与避坑
- 先配模型再跑指令：Midscene 依赖多模态模型做视觉定位，Playground 设置页里没填可用的模型密钥，第一条指令就不会有结果。
- Node 和 pnpm 版本别踩错：仓库要求 Node 20.19+（或 22.12+）、pnpm 9.3+，用 npm 硬装这个 pnpm workspace 会缺依赖。
- 本地模型 403 是我一开始的坑：用 Ollama 跑本地模型报 403 时，设置环境变量
OLLAMA_ORIGINS="*"再重启浏览器。 - 指令写具体一点：我一开始输「帮我处理一下表单」卡住，改成「点击页面右上角的登录按钮」就一次通过，描述得像在跟一个人交代任务。
- 扩展冲突导致页面报错：如果提示无法访问
chrome-extension://的 URL，通常是别的扩展往页面注入了资源，逐个禁用可疑扩展来定位。
延伸与下一步
Chrome 扩展的完整安装与模型配置流程，可以看仓库内的 快速开始；想把这些指令搬进测试脚本，接着读 Playwright 集成指南。现在就打开你天天用的那个页面，把第一条自然语言指令在 Playground 里跑一遍。
【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene
创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
