Playwright MCP Server：为大型语言模型提供浏览器自动化能力

Playwright MCP Server是什么？

Playwright MCP Server是一个使用Playwright实现的模型上下文协议服务器，能够为大型语言模型（LLMs）提供浏览器自动化能力，例如与网页交互、截屏以及在真实浏览器环境中执行JavaScript。

Playwright MCP Server功能特征

浏览器自动化

• 自动导航到指定网页。

• 与网页元素交互，例如点击、悬停、填写表单等。

• 执行 JavaScript 脚本。

• 获取浏览器控制台日志，便于调试。

截图功能

• 可以对整个页面或特定元素进行截图。

API 测试

• 支持通过简单的英文指令测试 API，包括 GET、POST、PUT、PATCH 和 ｄｅｌｅｔｅ 请求。

• 验证 API 响应中的特定属性。

上下文共享

• 通过 MCP 协议，为 LLM 提供网页上下文信息，增强模型的理解能力。

工具暴露

• 暴露浏览器操作工具，使 LLM 可以调用这些工具完成复杂任务。

Playwright MCP Server特点

与 LLM 深度集成

• 允许 LLM 在真实浏览器环境中操作网页。

• 支持多种主流浏览器（如 Chromium、Firefox、WebKit）。

简单易用

• 可通过 npm、mcp-get 或 Smithery 快速安装。

• 配置简单，适用于多种开发环境。

高效自动化

• 支持并发运行多个脚本，提升自动化效率。

• 无需编写复杂脚本，通过自然语言描述即可完成任务。

安全性

• 通过本地服务器运行，避免敏感数据上传至第三方平台。

Playwright MCP Server使用场景

• 自动化测试：自动化测试 Web 应用的功能。

• 数据抓取：从网页中抓取数据进行分析。

• 文档生成：生成网页截图用于文档或报告。

• 动态内容操作：在浏览器环境中执行复杂脚本，动态操作网页。

Playwright MCP Server安装使用

安装方法

你可以通过以下三种方式安装 Playwright MCP Server：

• 使用 npm：

npm install -g @executeautomation/playwright-mcp-server

• 使用 Smithery：

npx @smithery/cli install @executeautomation/playwright-mcp-server --client claude

• 使用 mcp-get：

npx @michaellatman/mcp-get@latest install @executeautomation/playwright-mcp-server

配置方法

安装完成后，需要在 Claude Desktop 的配置文件中进行以下配置：

找到 claude-desktop-config.json 文件，通常位于以下路径：

• Windows：%APPDATA%\Claude\claude_desktop_config.json

• macOS：~/Library/Application Support/Claude/claude_desktop_config.json

修改配置文件，添加 Playwright MCP Server 的配置：

{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["-y", "@executeautomation/playwright-mcp-server"]
}
}
}

使用方法

配置完成后，启动 Claude Desktop 客户端，你将看到 Playwright MCP Server 出现在 Attach MCP server 列表中。

项目主页：https://executeautomation.github.io/mcp-playwright

GitHub仓库：https://github.com/executeautomation/mcp-playwright