Playwright CLI上手教程：让AI帮你操控浏览器
微软在2026年初开源了一个叫Playwright CLI的命令行工具。这个工具专门给AI编程助手用的，比如Claude Code、GitHub Copilot这些。你只要用自然语言告诉AI“帮我抓这个页面的前100条评论”，AI就能通过Playwright CLI操控浏览器帮你完成。
这篇文章会从零开始教你用这个工具。
这东西是什么？跟以前的方案有什么区别
Playwright很多人应该听过，是微软出的浏览器自动化框架。以前AI要控制浏览器，主要走的是Playwright MCP（Model Context Protocol）方案。每次操作，MCP会把整个页面的无障碍树、截图这些数据全塞进AI的上下文窗口。
问题来了。一个典型的浏览器自动化任务，MCP方案大约要消耗114000个token，而CLI方案只需要大约27000个，差了差不多4倍。
两边的核心区别在哪？Playwright CLI把页面快照保存到磁盘上的YAML文件，而不是塞回AI的上下文窗口。AI收到的只是一个文件路径，需要的时候再去读。这样一来，AI在执行多步骤任务时不会因为上下文爆满而忘记之前干了什么。
环境搭建
1. 安装Node.js
去nodejs.org下载安装，版本要求18以上。装完验证一下：
node --version2. 安装Playwright CLI
通过npm全局安装：
npm install -g @playwright/cli@latest验证安装：
playwright-cli --version然后初始化工作空间并安装浏览器：
playwright-cli install
playwright-cli install-browser3. 安装AI编程助手
目前支持最好的两个框架是Claude Code（Anthropic出品）和Codex（OpenAI出品）。装好框架后，还需要安装Playwright CLI的Skills文件：
playwright-cli install --skills这个命令会在项目目录下生成.claude/skills/playwright-cli/文件夹，AI编程助手会自动发现并使用这些技能说明。
基础命令
Playwright CLI的操作逻辑很简单：打开浏览器，拿到页面快照，用元素编号来交互。
# 打开浏览器并导航到页面
playwright-cli open https://example.com
# 获取页面快照（会返回元素编号，比如e15、e21）
playwright-cli snapshot
# 用编号点击元素
playwright-cli click e15
# 输入文字
playwright-cli type "Hello World"
# 按键
playwright-cli press Enter
# 截图
playwright-cli screenshot
# 关闭浏览器
playwright-cli close两个常用参数：
--headed：打开可见的浏览器窗口（默认是无头模式，后台静默运行）
--persistent：保存cookie和登录状态到磁盘，下次不用重新登录
playwright-cli open https://example.com --headed --persistent还有一个实用的可视化面板：
playwright-cli show这个命令会打开一个仪表盘，里面展示所有运行中的浏览器会话的实时画面。点一下任意会话可以放大查看，甚至手动接管控制。
核心概念：Skills机制
Skills是这套方案里最关键的东西。
简单说，Skill就是一份操作说明书。微软官方把playwright-cli的使用方式直接封装成了一个skill，AI照着这份说明书就知道怎么用playwright-cli操作浏览器。
同样的，当你让AI在某个网站完成任务时，AI第一次也需要自己摸索网站的操作流程，这要消耗不少token。任务完成后，你可以把这次摸索的结果提炼成一个Skill文件，下次AI照着做就行了。
三种执行方式的效率对比：
首次探索：token消耗高（约占41%上下文窗口），需要AI参与，适合新任务第一次跑通
用Skill执行：token消耗低（约占5%上下文窗口），需要AI参与，适合重复执行的任务
导出为脚本：token消耗为零，不需要AI，适合完全固定的标准化流程
创建Skill的方法很简单。第一次任务跑完后，让AI自己总结流程就行了。你就告诉AI：“请把刚才的操作流程提炼成一个Skill，保存到项目目录下。”AI会生成一个包含步骤说明、避坑提示的Skill文件。下次执行同类任务，直接引用这个Skill。
实战案例
案例1：抓取电商评论导出CSV
让AI执行：“用Playwright CLI打开[商品页面]，抓取前100条用户评论，包括用户名、评分和评论内容，保存为reviews.csv。”
首次执行时AI会自己摸索翻页、定位元素。跑完后让它固化为Skill。之后抓同类商品的评论，效率能提升8到10倍。最后还可以让AI把整个流程导出为一段Shell脚本，以后完全脱离AI运行，token成本直接归零。
案例2：Markdown文章自动发布
很多人遇到过这个问题：Markdown文章粘贴到发布平台，格式乱了，图片也不显示。
解决思路分两步。第一步是预处理，让AI写一个Python脚本，把Markdown里的网络图片下载到本地，然后转成HTML格式。第二步是自动发布，用Playwright CLI打开发布平台，创建文章，粘贴HTML，上传本地图片，然后发布。把整个流程固化为Skill后，以后只需要给AI一个文件路径，剩下的全自动完成。
案例3：Web应用自动化测试
让AI读你的代码，自动生成测试用例，然后通过Playwright CLI逐条执行：注册，登录，核心功能操作，验证结果。配合定时任务，可以做到每天自动跑一遍回归测试。
CLI还是MCP
CLI更适合任务步骤多、流程相对固定的场景，因为可以在有限的上下文窗口里平衡浏览器操作和代码编写。MCP更适合需要AI反复观察页面、动态决策的探索性自动化场景。
简单判断标准：任务步骤多、流程固定，用CLI。需要AI反复观察页面、动态决策，用MCP。两者可以在同一个项目里混着用。
常见问题
支持哪些浏览器？
Chrome是默认的，也支持Firefox、WebKit、Edge。指定方式：
playwright-cli open --browser=firefox怎么处理需要登录的网站？
用--persistent参数保持登录态。登录一次后，后续操作不需要重新登录。
Skills的源码在哪？
Playwright CLI的官方npm包是@playwright/cli，Skills文档在GitHub仓库的skills/目录下。
本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！
