核心内容摘要
虚拟显示技术：突破物理硬件限制的多屏革命
摘要在 Web 自动化领域Selenium 曾经的霸主地位已成历史Playwright 凭其“快、稳、强”的现代特性成为了新标准。
而在 2026 年随着 LLM大语言模型和视觉多模态模型的爆发自动化测试与 RPA机器人流程自动化迎来了范式革命。
本文将深度解析 Playwright 的核心架构并手把手教你构建一个具备“自愈能力”的 AI 驱动自动化 Agent。
本文超 7000 字包含大量实战代码与反爬对抗技巧。
Selenium 已死Playwright 当立
1 自动化的“不可能三角”长期以来Web 自动化工程师都在速度、稳定性和抗检测性之间做取舍Selenium: 标准兼容好但太慢经常出现ElementNotInteractableException。
Puppeteer: 快但原生只支持 ChromePython 生态支持一般。
Cypress: 开发者体验好但局限于浏览器内部无法跨 Tab 操作。
Playwright的出现打破了这个僵局。
作为微软开源的神器它基于 CDP (Chrome DevTools Protocol) 但又不仅限于此提供了跨浏览器Chromium, Firefox, WebKit的统一 API。
2 为什么是 Playwright自动等待Auto-waiting告别time.sleep()。
Playwright 会自动等待元素显式、可点击后再执行操作。
网络拦截Network Interception原生支持修改请求和响应做 Mock 测试极为方便。
浏览器上下文Browser Context一个浏览器实例通过“沙箱”隔离可以毫秒级创建上百个独立的“账号环境”并发测试神器。
Shadow DOM 穿透原生的 CSS 选择器即可穿透 Shadow DOM这是 Selenium 的噩梦。
Playwright Script(Playwright 脚本)Browser Server(浏览器服务)Context 1 (Profile A)(上下文 1 - 配置文件A)Context 2 (Profile B)(上下文 2 - 配置文件B)Page 1(页面
Page 2(页面
Page 1(页面
1)
Playwright 核心实战不仅仅是点点点
1 异步与并发的最佳实践在 Python 中建议使用async_playwright来最大化性能。
importasynciofromplaywright.async_apiimportasync_playwrightasyncdefrun():asyncwithasync_playwright()asp:# 启动浏览器headlessFalse 可以看见界面browserawaitp.chromium.launch(headlessFalse)# 创建上下文相当于隐身模式窗口contextawaitbrowser.new_context(viewport{width:1920,height:1080},user_agentMozilla/
0 (Macintosh; Intel Mac OS X 10_15_
...)pageawaitcontext.new_page()awaitpage.goto(https://example.com)# 强大的选择器# 文本定位awaitpage.click(textGet Started)# CSS 文本混合awaitpage.click(button:has-text(Login))# XPath (不推荐但支持)awaitpage.fill(//input[nameusername],admin)# 截图保存证据awaitpage.screenshot(pathexample.png)awaitbrowser.close()asyncio.run(run())
2 Trace Viewer时间旅行调试器这是 Playwright 最杀手级的功能。
通过录制 Trace你可以事后回放整个脚本执行过程。
Timeline每一毫秒发生了什么。
Snapshots查看操作前后的 DOM 快照。
Network查看每个点击触发了什么网络请求。
启用方式非常简单awaitcontext.tracing.start(screenshotsTrue,snapshotsTrue,sourcesTrue)# ... 执行操作 ...awaitcontext.tracing.stop(pathtrace.zip)然后用playwright show-trace trace.zip即可可视化分析。
AI 赋能——构建“自愈”自动化脚本传统脚本最怕什么前端改版。
只要开发把button idsubmit-v1改成了button classbtn-primary-new你的脚本就挂了。
在 2026 年我们不需要手动修脚本我们让 AI 来修。
1 视觉定位Visual Grounding如果选择器失效我们可以抓取当前页面的截图发给 GPT-4o 或 Gemini
5 Pro 这样的多模态模型问它“注册按钮在哪里”
2 实战AI 自愈点击函数importbase64fromopenaiimportAsyncOpenAI clientAsyncOpenAI(api_keysk-...)asyncdefai_smart_click(page,description): 当常规选择器失败时使用 AI 进行视觉定位点击 try:#
尝试常规模糊定位awaitpage.click(ftext{description},timeout
exceptException:print(f常规定位失败启动 AI 视觉定位:{description}...)#
截图screenshot_bytesawaitpage.screenshot()base64_imagebase
b64encode(screenshot_bytes).decode(utf-
#
询问 VLM (Visual Language Model)responseawaitclient.chat.completions.create(modelgpt-4o,messages[{role:user,content:[{type:text,text:fLocate the center coordinates (x, y) of the element described as {description} on this webpage screenshot. Return ONLY json like .},{type:image_url,image_url:{url:fdata:image/jpeg;base64,{base64_image}}}],}],response_format{type:json_object})coordseval(response.choices[0].message.content)print(fAI 定位坐标:{coords})#
执行物理点击awaitpage.mouse.click(coords[x],coords[y])# 使用# await ai_smart_click(page, 蓝色的提交订单按钮)这种模式虽然比纯选择器慢需要调用 API但它极大地提高了脚本的鲁棒性。
在关键业务流程如支付下单中稳定性高于一切。
反爬与隐身Stealth Mode现在稍微像样点的网站都有 Bot 检测Cloudflare, Akamai。
直接用 Playwright 可能会被识别为机器人。
1 特征检测原理网站会检查navigator.webdriver属性或者检测 WebGL 指纹、字体列表等。
2 完美伪装方案我们可以使用playwright-stealth库或者手动注入 JS 来掩盖特征。
asyncdefstealth_init(page):awaitpage.add_init_script( // 掩盖 webdriver 属性 Object.defineProperty(navigator, webdriver, { get: () undefined }); // 伪造 Chrome 插件列表 (如果是 headless 模式) if (!navigator.plugins || navigator.plugins.length
{ // ... 注入 Mock 数据 } // 覆盖 WebGL 指纹 const getParameter WebGLRenderingContext.prototype.getParameter; WebGLRenderingContext.prototype.getParameter function(parameter) { if (parameter
{ return Intel Inc.; } if (parameter
{ return Intel Iris OpenGL Engine; } return getParameter(parameter); }; )此外最重要的技巧是保存状态State Storage。
不要每次都重新登录而是像真能人一样复用 Cookies。
# 登录一次保存状态awaitpage.context.storage_state(pathstate.json)# 下次直接加载contextawaitbrowser.new_context(storage_statestate.json)
高性能集群化部署当你需要每天抓取 100 万个页面单机单进程就不够看了。
1 生产者-消费者模式结合我们之前讲的asyncio我们可以构建一个极致性能的爬虫集群。
asyncdefworker(context,queue):whileTrue:urlawaitqueue.get()pageawaitcontext.new_page()try:# 开启资源过滤极大提升速度awaitpage.route(**/*.{png,jpg,jpeg,gif,css,font},lambdaroute:route.abort())awaitpage.goto(url)# ... 业务逻辑 ...finally:awaitpage.close()queue.task_done()asyncdefmain():queueasyncio.Queue()# 填充任务foriinrange(
:queue.put_nowait(fhttps://example.com/item/{i})asyncwithasync_playwright()asp:browserawaitp.chromium.launch()contextawaitbrowser.new_context()# 启动 10 个并发 Worker 共享同一个浏览器实例资源开销最小workers[asyncio.create_task(worker(context,queue))for_inrange(
]awaitqueue.join()这种共享Browser Instance但隔离Page的模式比开启 10 个浏览器要节省 90% 的内存。
结语自动化测试的终局2026 年的 Playwright 已经不再仅仅是一个测试工具它是连接 AI 大脑与数字世界的手臂。
对于测试工程师掌握 Playwright AI意味着你可以写出永远不挂的测试用例。
对于爬虫工程师Playwright 提供了最强的渲染能力和对抗能力。
对于全栈开发它是在后端生成 PDF、截图、自动化运维的最佳胶水。
未来已来现在的自动化不再是写死的脚本而是能够感知、理解并自我修复的智能 Agent。
本文代码基于 Playwright Python