【AI学习】 playwright-cli + SKILL 替换 chrom-devTools-MCP

1. 告别一切重复枯燥任务，CLI+Skill搭建浏览器AI自动化框架

告别一切重复枯燥任务，CLI+Skill搭建浏览器AI自动化框架_哔哩哔哩_bilibili

这是 B 站 UP 主技术爬爬虾 发布的 AI 浏览器自动化实战教程，核心是用AI Agent+Playwright CLI 实现浏览器全自动操作，大幅省 Token、无需写代码。

视频核心内容总结

核心方案
- AI Agent 框架：Claude Code / Codex（二选一）。
- 浏览器自动化：Playwright CLI + 配套 Skill，替代传统 Playwright MCP 方案。
核心优势
- 极省 Token ：比 MCP 方案省约 4 倍 Token ，固定流程可0 Token 运行。
- 无需懂代码 ：用自然语言即可让 AI 操控浏览器完成任务。
- 工作流可沉淀：把重复操作固化为 Skill，复用且稳定高效。
能做什么（实战场景）
- 电商评论抓取并导出 CSV
- Markdown 文章自动发布到社交平台
- Web 应用 AI 自动化 E2E 测试
- 批量打开、点击、输入、截图等浏览器操作。
技术亮点
- Playwright CLI：微软 2026 年初开源，命令行轻量化操控浏览器。
- Skill 机制：给 AI 提供工具使用说明，让模型正确调用 CLI 命令。
- 按需加载：不把全量 DOM 塞进上下文，只传精简摘要与文件路径，极省资源。
简要步骤
- 安装 Playwright CLI 并导入官方 Skill
- 接入 Claude Code/Codex
- 自然语言下达指令，AI 自动执行浏览器自动化任务。

一句话概括：用自然语言命令 AI 替你操作浏览器，低成本、零代码、全自动搞定一切网页重复工作。

视频全套可直接复制命令

一、安装 Playwright CLI（视频原版一键流程）

安装 playwright

bash

运行

复制代码

pip install playwright

安装浏览器驱动

bash

运行

复制代码

playwright install chrome

二、Claude Code 接入 Playwright Skill（视频核心配置）

新建文件夹，放入官方 playwright-skill.md 技能文件
Claude Code 加载本地技能库

bash

运行

复制代码

claude --skill ./playwright-skill

三、AI 自然语言控制浏览器（直接复制发给 AI）

plaintext

复制代码

使用playwright打开浏览器，打开网页，点击按钮，输入内容，截图保存，导出数据
全程不加载多余DOM，精简上下文，节省token

四、视频核心省钱 & 稳定技巧

不读取完整网页 DOM，只传页面摘要，Token 减少 75% 左右
固定流程固化成 Skill 脚本，重复任务零 Token 运行
不用 Playwright Python 脚本，只用 CLI 命令，AI 调用更快更稳
无头模式后台运行，不弹出浏览器窗口

bash

运行

复制代码

playwright run --headless

五、视频实战常用指令模板

批量爬取网页数据导出 Excel
自动登录网站、签到、填表
多页面循环点击、复制内容
网页自动化测试、批量发布文案

视频原版 playwright-skill 完整文案

复制代码

# Playwright CLI 浏览器自动化技能
## 指令规则
1. 优先使用 playwright cli 命令操作浏览器，不写Python代码
2. 不读取完整DOM源码，只获取页面精简信息，极致节省Token
3. 默认使用Chrome无头模式运行，不弹出可视化窗口
4. 自动完成打开网页、点击、输入、滚动、截图、提取文本、导出文件

## 常用命令
打开网页
playwright goto https://xxx.com

点击元素
playwright click 按钮名称

输入内容
playwright type 输入框 内容

页面截图
playwright screenshot ./page.png

提取页面文本
playwright extract text

等待页面加载
playwright wait 3s

导出数据为csv
playwright export csv ./data.csv

无头后台运行
playwright run --headless

## 工作要求
- 自然语言需求直接转CLI指令执行
- 流程固定后固化步骤，重复任务零Token调用
- 不冗余抓取网页内容，精简上下文长度
- 报错自动重试，保证浏览器任务稳定运行

2.为什么越来越多的人抛弃 MCP，转向 CLI

为什么越来越多的人抛弃 MCP，转向 CLI？_哔哩哔哩_bilibili

AI总结：

本文围绕当前 AI Agent 领域中 MCP 与 CLI 两种工具调用方式的技术选型争议展开，通过大量实操对比与原理分析，深入解释了为何原本被视为 "Agent 万能接口" 的 MCP 正被众多顶级开发者放弃，转而回归更原始的 CLI 命令行工具。文章先以 ffmpeg、grep、ImageMagick 等常见 CLI 工具为例，结合 Perplexi、Y Combinator 等技术团队的实际选择，点明 CLI 回归的行业趋势。随后从 token 消耗、执行效率两大维度，通过 GitHub MCP 与 bash 调用、图片处理流水线等真实场景，详细对比了 MCP 工具信息冗余、交互繁琐、成本高昂，以及 CLI 极简高效、支持管道链式组合、贴合 UNIX 设计哲学的优势。同时也客观指出 MCP 在结构化参数、执行稳定性、环境安全性上的不可替代性，尤其适合企业与云端高管控场景。最终得出结论：未来 CLI 将主导轻量化、个人化 AI 应用，MCP 则聚焦于安全与稳定性要求严苛的企业级场景，二者形成分工互补的格局，而非简单的取代关系。

重要亮点

CLI 在 token 消耗上具备碾压性优势，可大幅降低 AI 调用成本：MCP 需要将每个工具的名称、功能、入参格式等完整元信息传入模型上下文，仅 GitHub 一个 MCP Server 就包含 44 个工具、1683 行描述、约 1.4 万 token，单次请求成本可观；而 CLI 仅需传入一个 bash 工具描述（十余行），模型凭借训练中已掌握的 git、gh、grep 等常用命令即可直接生成执行语句，冷门工具只需补充简易文档，token 消耗几乎可忽略，在多工具并行场景下成本差异更为悬殊，对规模化 AI 应用极为友好。
CLI 执行效率远超 MCP，依托管道组合实现一站式自动化 ：MCP 模式下模型需作为中央调度器，逐次调用读取目录、解析图片、加水印、上传等独立工具，每一步都要等待模型推理与结果回传，流程冗长；而 CLI 可通过管道符|、逻辑与&&等符号将 exiv2、ImageMagick、scp 等单一功能工具拼接为完整流水线，一次命令下发即可在本地自动完成筛选、处理、上传全流程，无需模型反复介入，充分践行 "一个工具只做一件事并做到极致" 的 UNIX 哲学，灵活性与执行速度远胜固定化的 MCP 调用。
MCP 在可控性与安全性上存在不可替代的核心价值 ：CLI 命令易因文件名含特殊字符、语法冲突等隐蔽问题执行失败，复杂命令出错概率更高；而 MCP 采用 JSON 结构化传参，参数边界清晰、转义规范，执行结果更稳定可控。同时 CLI 拥有完整系统权限，模型一旦生成rm -rf等危险指令可能导致文件丢失或服务器崩溃，尤其在云端共享环境中风险不可接受；MCP 则通过预设能力边界实现严格权限管控，更适合企业生产、云端服务等高安全要求场景。