01-Playwright 浏览器与上下文

01-Playwright 浏览器与上下文

Playwright 的核心架构基于三层模型：Browser → Context → Page。理解这三层对于编写稳定、高效的自动化脚本至关重要。

1. 架构层次

Browser (浏览器实例) └── Context (隔离的浏览环境) └── Page (标签页)

2. 支持的浏览器

fromplaywright.sync_apiimportsync_playwrightwithsync_playwright()asp:# Chromium - 最快，最稳定browser=p.chromium.launch()# Firefox - 部分功能有差异browser=p.firefox.launch()# WebKit - Safari 内核browser=p.webkit.launch()

启动速度对比：

• Chromium: ~800ms（最快）
• Firefox: ~1200ms
• WebKit: ~1500ms

3. Browser 启动选项

browser=p.chromium.launch(headless=True,# True=无头模式, False=有头模式slow_mo=100,# 每个操作延迟 100ms（方便观察）args=[# 浏览器启动参数"--disable-dev-shm-usage",# Docker 中常用"--start-maximized",# 最大化窗口],executable_path="/path/to/chrome",# 自定义浏览器路径downloads_path="./downloads",# 下载保存路径timeout=30000,# 启动超时)

4. Context 上下文配置

Context 是 Playwright 最强大的特性之一，每个 Context 拥有独立的 cookies、localStorage 和 session：

context=browser.new_context(# 视口大小viewport={"width":1280,"height":720},# 用户代理user_agent="Mozilla/5.0 (Windows NT 10.0; Win64; x64) ...",# 语言和时区locale="zh-CN",timezone_id="Asia/Shanghai",# 地理位置geolocation={"latitude":31.2304,"longitude":121.4737},permissions=["geolocation"],# 授予权限# 颜色方案color_scheme="dark",# "light" | "dark" | "no-preference"# 安全ignore_https_errors=True,# 忽略 HTTPS 证书错误# 代理proxy={"server":"http://proxy.example.com:8080","username":"user","password":"pass",},# 存储状态（恢复登录态）storage_state="auth.json",# 视频录制record_video_dir="./videos",record_video_size={"width":1280,"height":720},# HAR 网络录制record_har_path="network.har",)

5. Context 隔离示例

# 两个完全隔离的上下文context1=browser.new_context()context2=browser.new_context()page1=context1.new_page()page2=context2.new_page()# page1 登录page1.goto("https://example.com/login")page1.fill("#username","user1")page1.click("#login-btn")# page2 完全不知道 page1 的登录状态# cookies、localStorage 完全独立page2.goto("https://example.com/dashboard")# page2 会重定向到登录页，因为该 context 未登录

6. 资源管理

# 方式 1: with 语句（推荐）withsync_playwright()asp:browser=p.chromium.launch()context=browser.new_context()page=context.new_page()# ... 操作 ...# 自动释放所有资源# 方式 2: 显式关闭browser=p.chromium.launch()try:page=browser.new_page()page.goto("https://example.com")finally:browser.close()# context 和 page 也会被关闭# 方式 3: 分层关闭page=context.new_page()# ... 使用 ...page.close()# 先关 pagecontext.close()# 再关 contextbrowser.close()# 最后关 browser

7. 存储状态（认证复用）

# 保存登录状态context1=browser.new_context()page1=context1.new_page()page1.goto("https://example.com/login")page1.fill("#username","admin")page1.fill("#password","secret")page1.click("#login-btn")page1.wait_for_url("**/dashboard")# 保存到文件context1.storage_state(path="auth.json")# 后续测试直接复用context2=browser.new_context(storage_state="auth.json")page2=context2.new_page()page2.goto("https://example.com/dashboard")# page2 已处于登录状态！

8. 最佳实践

1. 复用 Browser：Browser 启动开销大，在测试套件中复用
2. 每测试一个 Context：利用 Context 隔离确保测试独立
3. 使用 with 语句：自动清理资源，避免内存泄漏
4. storage_state 复用认证：避免每次测试重复登录
5. 选择合适的浏览器：CI 中用 Chromium（最快），兼容性测试用多种浏览器

常用 API 速查