Playwright基础使用教程(附完整代码拆解)
Playwright基础使用教程附完整代码拆解本文适合Playwright新手将详细讲解Playwright的安装方法、核心优势以及一段完整自动化代码的每一步知识点通俗易懂可直接复制学习适配CSDN技术博客发布需求。一、Playwright简介为什么要使用它在学习代码之前我们先搞清楚为什么做自动化测试/网页自动化优先选Playwright而非Selenium等其他工具Playwright是微软推出的一款自动化测试工具专门用于Web端自动化浏览器操作相比其他同类工具它的核心优势的是“简单、稳定、全能”具体如下新手也能快速理解无需额外配置驱动很多工具比如Selenium需要手动下载浏览器驱动如ChromeDriver还要匹配浏览器版本新手很容易踩坑Playwright安装后会自动下载对应浏览器的驱动无需手动操作开箱即用。跨浏览器支持一次性支持Chrome谷歌、Firefox火狐、Edgeedge三大主流浏览器不用改代码只需修改一行配置就能切换浏览器运行。稳定性极高内置智能等待机制不用手动写“等待时间”比如time.sleep()能自动等待元素加载完成再操作避免因元素未加载而报错新手再也不用被“元素找不到”困扰。API简洁易懂语法简单封装度高一行代码就能实现“打开浏览器、输入内容、点击按钮”等常用操作上手成本极低适合新手入门。功能强大支持页面截图、PDF生成、网络请求拦截、多页面操作、无头模式后台运行不弹出浏览器等满足自动化测试、网页爬取、批量操作等多种需求。总结如果你是新手想快速实现网页自动化比如自动登录、自动填写表单、自动点击Playwright是最优选择不用折腾环境专注于代码逻辑即可。二、Playwright安装方法详细步骤零踩坑Playwright基于Python开发也支持其他语言安装分为两步安装Playwright库 安装浏览器驱动自动全程命令行操作新手跟着来就行。2.1 前提安装Python确保你的电脑已经安装了Python3.7及以上版本可以通过以下命令验证python--version# Windows系统# 或python3--version# Mac/Linux系统如果显示Python版本如3.9.6说明已安装如果未安装去Python官网下载对应系统版本安装时勾选“Add Python to PATH”Windows避免后续配置环境变量。2.2 安装Playwright库打开命令行WindowsCMD或PowerShellMac/Linux终端输入以下命令一键安装Playwright库pipinstallplaywright# Windows系统# 或pip3installplaywright# Mac/Linux系统等待安装完成约1-3分钟取决于网络速度安装成功后不会有报错提示命令行会回到正常输入状态。2.3 安装浏览器驱动自动安装完Playwright库后输入以下命令自动下载Chrome、Firefox、Edge三大浏览器的驱动无需手动匹配版本playwrightinstall等待下载完成约5-10分钟驱动文件较大建议用稳定网络下载完成后Playwright就可以正常使用了。2.4 验证安装成功输入以下命令若能正常运行说明安装成功fromplaywright.sync_apiimportsync_playwrightwithsync_playwright()asp:browserp.chromium.launch(headlessTrue)browser.close()运行后没有报错就说明环境配置无误可以开始学习后续代码了。三、完整代码逐行拆解每步附说明作用以下是你提供的完整代码我们逐行拆解讲解每一步的作用、使用方法和注意事项确保新手能看懂、会用。fromplaywright.sync_apiimportsync_playwrightwithsync_playwright()asp:browserp.chromium.launch(headlessFalse)# 设置无头模式默认为Truepagebrowser.new_page()page.goto(https://www.baidu.com/)page.set_viewport_size({width:1920,height:1080})# print(page.title())# print(page.url)# print(page.content())# 用xpath给输入框填内容ele_inputpage.locator(//textarea[idchat-textarea])ele_input.fill(你好)# css 选择器给按钮点击ele_bottompage.locator(#chat-submit-button)ele_bottom.click()page.wait_for_timeout(50000000)3.1 第1行导入Playwright核心模块fromplaywright.sync_apiimportsync_playwright作用导入Playwright的同步API模块sync_playwright这是Playwright最常用的模块适合新手同步代码逻辑简单容易理解。说明Playwright有两种模式同步sync和异步async新手优先学同步模式代码一行一行执行逻辑清晰异步模式适合高级场景需要用到async/await语法。如果导入报错说明Playwright安装失败重新执行“pip install playwright”和“playwright install”命令即可。3.2 第2行创建Playwright上下文核心语法withsync_playwright()asp:作用创建一个Playwright上下文所有的浏览器操作打开浏览器、打开页面等都要在这个上下文里面执行。说明“with”关键字是Python的上下文管理器作用是“自动释放资源”——当代码执行完上下文里的内容后会自动关闭浏览器、释放内存不用手动写“browser.close()”避免资源泄露。“as p”是给上下文起一个别名“p”后续通过“p”来调用浏览器如p.chromium、p.firefox。3.3 第3行打开Chrome浏览器browserp.chromium.launch(headlessFalse)# 设置无头模式默认为True作用启动Chrome浏览器chromium就是Chrome的开源版本功能和Chrome完全一致并返回浏览器实例后续通过“browser”操作浏览器。关键参数说明headlessFalse设置浏览器为“非无头模式”即会弹出浏览器窗口我们可以看到自动化操作的全过程适合调试、学习如果设置为“headlessTrue”则浏览器在后台运行不弹出窗口适合实际运行、批量操作。其他常用参数可选slow_mo1000设置操作延迟单位毫秒比如1000就是每一步操作延迟1秒方便观察操作过程适合新手调试。args[--start-maximized]启动浏览器时最大化窗口不用手动设置窗口大小。补充如果想打开Firefox或Edge浏览器只需把“p.chromium”改成“p.firefox”或“p.edge”比如browserp.firefox.launch(headlessFalse)# 打开Firefox浏览器browserp.edge.launch(headlessFalse)# 打开Edge浏览器3.4 第4行新建浏览器页面pagebrowser.new_page()作用在打开的浏览器中新建一个空白页面相当于我们手动打开Chrome后点击“”号新建标签页后续所有的页面操作访问网址、输入内容等都在这个“page”实例上执行。说明一个浏览器实例browser可以新建多个页面比如再写一行“page2 browser.new_page()”就会新建第二个标签页两个页面可以独立操作。3.5 第5行访问指定网址page.goto(https://www.baidu.com/)作用让新建的页面跳转到指定的网址这里是百度首页相当于我们手动在浏览器地址栏输入网址并按回车。说明网址必须完整包含“http://”或“https://”否则会报错比如写成“www.baidu.com”会失败必须写“https://www.baidu.com/”。Playwright会自动等待页面加载完成再执行下一行代码不用手动写等待这就是它的智能等待优势。3.6 第6行设置浏览器窗口大小page.set_viewport_size({width:1920,height:1080})作用设置当前页面的视口大小即浏览器窗口的宽和高这里设置为1920×1080高清屏尺寸避免因窗口太小导致元素被遮挡无法操作。说明参数是一个字典key为“width”宽度和“height”高度值为整数单位像素。如果想让窗口最大化也可以用“page.maximize_window()”替代这一行代码更简洁page.maximize_window()# 窗口最大化无需设置宽高3.7 第7-9行注释的调试代码重要# print(page.title())# print(page.url)# print(page.content())作用这三行是调试代码被“#”注释了注释的代码不会执行用于查看页面信息方便调试新手建议掌握。逐行说明取消注释后执行print(page.title())打印当前页面的标题比如百度首页的标题是“百度一下你就知道”用于验证是否成功访问目标页面。print(page.url)打印当前页面的URL网址用于验证页面是否跳转到正确的地址。print(page.content())打印当前页面的HTML源代码用于查看页面的元素结构比如查找输入框、按钮的定位方式。3.8 第10-11行用XPath定位输入框并填写内容# 用xpath给输入框填内容ele_inputpage.locator(//textarea[idchat-textarea])ele_input.fill(你好)作用通过XPath定位到页面中的输入框元素然后向输入框中填写“你好”这是自动化中最常用的操作之一比如自动填写表单、搜索框。逐行说明page.locator(//textarea[idchat-textarea])定位元素的核心方法“locator”是Playwright推荐的定位方式支持多种定位语法这里用的是XPath语法。XPath语法解释//textarea[idchat-textarea]—— 找到页面中所有“textarea”标签文本输入框标签且“id”属性等于“chat-textarea”的元素id是唯一的能精准定位到输入框。补充如果定位不到元素大概率是XPath语法错误或者元素还没加载完成但Playwright有智能等待一般不会出现后者。ele_input.fill(你好)给定位到的输入框元素ele_input填写内容“你好”相当于我们手动点击输入框然后输入文字。补充填写内容时会自动清空输入框中原有的内容无需手动清空比如输入框有默认提示文字fill会自动清空后再填写。3.9 第12-13行用CSS选择器定位按钮并点击# css 选择器给按钮点击ele_bottompage.locator(#chat-submit-button)ele_bottom.click()作用通过CSS选择器定位到页面中的按钮元素然后点击按钮比如提交表单、搜索按钮和上一步的输入操作配合完成“输入提交”的完整流程。逐行说明page.locator(#chat-submit-button)这里用的是CSS选择器定位“#”表示根据id属性定位“chat-submit-button”是按钮的id和XPath定位的效果一致只是语法不同。CSS选择器语法解释#chat-submit-button—— 找到页面中id为“chat-submit-button”的元素id唯一精准定位按钮。ele_bottom.click()点击定位到的按钮元素相当于我们手动点击按钮。关键区别XPath和CSS选择器是两种最常用的元素定位方式新手可根据习惯选择XPath语法更灵活支持多种条件比如根据文本、属性、层级关系定位适合复杂场景。CSS选择器语法更简洁执行速度更快适合简单场景比如根据id、class定位。3.10 第14行设置等待时间page.wait_for_timeout(50000000)作用设置页面等待时间单位毫秒这里设置的是50000000毫秒约13.8小时目的是让浏览器保持打开状态方便我们观察自动化操作的结果比如点击按钮后页面的变化。说明这个等待时间是“强制等待”不管页面是否加载完成都会等待指定的时间适合调试时使用实际运行自动化脚本时一般不需要设置这么长的时间甚至可以省略因为Playwright有智能等待。如果想让脚本执行完后自动关闭浏览器只需删除这一行代码——当“with”上下文执行完毕后会自动关闭浏览器。补充调试时也可以设置较短的等待时间比如50005秒避免等待过久page.wait_for_timeout(5000)# 等待5秒后自动关闭浏览器四、常见问题及解决方法新手必看在运行代码时新手可能会遇到以下问题这里整理了常见问题和解决方法避免踩坑问题1导入模块报错ModuleNotFoundError: No module named ‘playwright’解决方法重新安装Playwright执行命令“pip install playwright”如果还是报错检查Python环境是否正确比如多个Python版本用对应版本的pip安装。问题2浏览器无法启动报错“Could not find browser executable”解决方法重新执行“playwright install”确保浏览器驱动下载完成如果还是报错重启电脑后再尝试。问题3定位不到元素TimeoutError: Locator timed out解决方法1. 检查定位语法XPath或CSS选择器是否正确可通过“print(page.content())”查看页面HTML确认元素的id、标签是否正确2. 确认页面是否成功加载可添加“page.wait_for_timeout(3000)”等待3秒后再定位。问题4点击按钮后页面没有反应解决方法检查按钮是否被遮挡比如弹窗、广告可设置窗口最大化page.maximize_window()或者用“page.wait_for_selector()”等待按钮可点击后再点击page.wait_for_selector(#chat-submit-button) # 等待按钮可点击 ele_bottom page.locator(#chat-submit-button) ele_bottom.click()五、总结本文详细讲解了Playwright的安装方法、核心优势以及完整自动化代码的每一步知识点重点关注“定位元素”和“常用操作”新手只要跟着代码拆解一步步学习就能快速上手Playwright。后续可以尝试修改代码比如更换网址、修改输入内容、切换浏览器多练习就能熟练掌握如果需要实现更复杂的功能比如自动登录、截图、爬取数据可以关注后续教程。最后将本文代码复制到Python文件中运行即可看到完整的自动化效果赶紧动手试试吧