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

MCP 服务器 Playwright

一个提供浏览器自动化功能的模型上下文协议（Model Context Protocol）服务器，使用 Playwright 实现
_{启用大语言模型与网页交互、截取屏幕截图以及在真实的浏览器环境中执行 JavaScript}

简介

MCP 服务器 Playwright 是一个基于 Playwright 的工具，用于在浏览器环境中执行自动化操作。它支持多种浏览器功能，包括截取屏幕截图、控制台日志捕获以及与网页元素交互。

安装

使用以下命令安装 MCP 服务器 Playwright：

```bash npm install @automatalabs/mcp-server-playwright ```

快速入门

```javascript const { createServer } = require('@automatalabs/mcp-server-playwright');

async function main() { const server = await createServer(); await server.start(); }

<h2 align="center">功能</h2>

### 浏览器操作
- **导航**：通过 URL 访问网页  
  ```javascript
  await page.goto('https://example.com');

• 截取屏幕截图：捕获当前视图的 PNG 图像

  const screenshot = await page.screenshot();
  

• 控制台日志：获取浏览器控制台输出

  const logs = await page.logs();
  

元素交互

• 点击元素：通过选择器或文本定位并点击元素

  await page.click('#menu-item');
  await page.clickText('Hover me');
  

• 填充表单：向输入框中填写内容

  await page.fill('#input-field', 'Hello World');
  

• 选择下拉选项：通过选择器或文本选择下拉菜单中的选项

  await page.select('#dropdown', 'option-value');
  await page.selectText('#dropdown', 'Choose me');
  

脚本执行

• 执行 JavaScript：在浏览器环境中运行任意脚本

  const title = await page.evaluate('document.title');
  

资源访问

1. 截图资源 (screenshot://<n>)：

   • 访问指定名称的 PNG 图像文件
   • 使用截取屏幕截图命令获取

2. 控制台日志资源 (console://logs)：

   • 获取浏览器控制台输出文本
   • 包含所有控制台消息

示例

const { createServer } = require('@automatalabs/mcp-server-playwright');

async function main() {
  const server = await createServer();
  await server.start();

  // 导航到网页
  await page.goto('https://example.com');

  // 截取屏幕截图
  const screenshot = await page.screenshot({ name: 'homepage' });

  // 填充表单
  await page.fill('#input-field', 'Hello World');
  
  // 提交表单
  await page.click('#submit-button');

  console.log('操作完成');
}

main().catch(console.error);

许可

本项目遵循 MIT 许可证，具体请参阅 [LICENSE](https://github.com/Automata-Labs-team/MCP-Server-Playwright/blob/main/LICENSE) 文件。