资讯动态

Midscene Chrome 扩展:10 分钟零选择器跑通浏览器自动化,附 Bridge 完整配置

发布时间:2026/10/15 6:11:15 来源:尧图企业网站定制
Midscene Chrome 扩展10 分钟零选择器跑通浏览器自动化附 Bridge 完整配置【免费下载链接】midsceneSee interfaces like a human. E2E testing in natural language.项目地址: https://gitcode.com/GitHub_Trending/mid/midsceneMidscene Chrome 扩展让你不写选择器就能用自然语言操作网页。跟着本文装好扩展、配好模型、发出第一条指令最后把脚本接到你日常浏览器上复用现成登录态。 从一次真实的下单回归说起新版本上线前QA 要先点一遍下单流程填商品、提交、看确认页。手动跑一次十分钟写成脚本呢得先搭一套浏览器自动化工程维护一堆脆弱的 CSS 选择器新开的浏览器档案里登录态还是零每次都得重新输密码。Midscene 的思路反过来先在不搭工程的侧边栏里用自然语言把流程跑通验证过的指令再原样搬进测试脚本。搭环境、写选择器、处理登录这三件烦心事被依次绕开。 零配置装好装扩展、配模型、发首条指令一条流安装二选一。普通用户直接在 Chrome 应用商店搜 Midscene 安装自带自动更新最省心开发者或访问不了商店的下载扩展安装包在chrome://extensions/打开开发者模式加载已解压的扩展程序。扩展源码就在 apps/chrome-extension/src/想研究实现可以直接读。装好后在扩展列表里点开 Midscene浏览器右侧就会出现侧边栏。点侧边栏的设置图标把模型配置粘贴进去并保存MIDSCENE_MODEL_BASE_URLhttps://你的模型服务端点 MIDSCENE_MODEL_API_KEY你的API-KEY MIDSCENE_MODEL_NAME你的模型名这里需要一个具备 UI 定位能力的多模态模型支持的模型与完整配置项见模型配置文档。保存之后在任意页面的侧边栏输入点击登录按钮回车。模型看一眼当前页面找到按钮点下去——第一条指令跑通。⚡ 三种指令拆解一行指令跑通操作、提取与校验侧边栏里三种最常用的指令和代码里的 Agent API 一一对应。在扩展里验证过写进脚本时换个皮就行。aiAct把点击、填写、导航交给自然语言回归表单流程时你不想记输入框的 id。直接说人话点击登录按钮、在搜索框输入 Midscene。模型负责判断该碰哪个元素这就是像人一样看界面的本意——选择器从此退出舞台。aiQuery把页面变成结构化数据要从列表页抓商品填进报表把数据形状写清楚页面中的商品{name: string, price: number}[]。验证通过后这样搬进脚本await agent.aiAct(点击登录按钮); const products await agent.aiQuery(页面中的商品{name: string, price: number}[]);你定义的是数据形状不是元素路径。页面改版了换个形状就行。aiAssert一句话给界面状态盖印章要确认流程真的生效而不是应该生效。跑一句页面顶部显示导航栏通过或失败立等取测试用例的断言就有了。 复用登录态三步走让脚本接管你天天用的 Chrome自动化的最痛处不是写操作是登录。你桌面 Chrome 里 cookie 齐整脚本拉起的光板浏览器却一无所有。Bridge 模式把这件事调了个个儿你手动登录脚本干活两者共用一套浏览器状态。扩展装好后默认在后台监听图标黄点表示监听中绿点表示已连上。第一步终端装依赖npm install midscene/web tsx。第二步写个最小脚本demo-bridge.tsimport { AgentOverChromeBridge } from midscene/web/bridge-mode; const agent new AgentOverChromeBridge(); await agent.connectNewTabWithUrl(https://www.bing.com); await agent.ai(type AI 101 and hit Enter);第三步运行tsx demo-bridge.tsChrome 弹出确认窗点 Allow新标签页随即交给脚本操作。注意模型配置写在终端的环境变量里不是浏览器侧。跨机器远程访问与安全细节见 Bridge 模式文档。 踩坑速查四个高频症状对症下药症状常见原因解法指令执行了但页面无反应其他扩展向页面注入了脚本与 Midscene 冲突在页面 DevTools 里找chrome-extension://开头的资源禁用对应扩展后刷新模型请求报 403本地 Ollama 模型缺少来源放行设置环境变量OLLAMA_ORIGINS*Bridge 连不上脚本没跑起来或确认窗没点 Allow看扩展 Bridge Mode 面板状态先确认脚本在运行Bridge 脚本传不了本地文件未开启文件 URL 访问扩展详情页开启 Allow access to file URLs再重新连接回到下单回归那个场景工程没搭选择器没写密码也没再输一遍。下一步把验证过的指令接进真实用例完整衔接见集成到 Playwright。【免费下载链接】midsceneSee interfaces like a human. E2E testing in natural language.项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价 →
↑