AI导哈

浏览器自动化服务器

Playwright MCP是一个基于微软Playwright的Web自动化服务器，为LLM/Agent提供浏览器控制、结构化数据提取和自动化工具集成。

  • by Mustafaakgul354
  • JavaScript
  • 本地部署
  • 更新于
在 GitHub 查看 Mustafaakgul354/playwright-mcp

使用说明

🎭 剧作家MCP-Web自动化服务器

使用官方 Microsoft Playwright MCP 服务器为 LLM/Agent 提供 Web 浏览器自动化功能的 MCP 服务器。

✨ 产品特点

  • 🌐 浏览器控制完全控制 Chromium、Firefox 和 WebKit
  • 🔍 结构化数据不仅仅是像素，还有可访问性树（Accessibility Tree）
  • 🤖 LLM/代理集成与OpenAI和其他LLM直接集成
  • 🚀 MCP 协议支持标准模型上下文协议
  • 📦 准备好的车辆导航，点击，文本输入，截图等。

📋 工具（Tools）

1. launch_browser

启动浏览器 。

{
  "browser_type": "chromium|firefox|webkit",
  "headless": true
}

2. navigate

转到指定的 URL。

{
  "url": "https://example.com"
}

3. click

点击指定选择器中的项目 。

{
  "selector": "button.submit"
}

4. fill

在输入字段中输入文本。

{
  "selector": "input#search",
  "text": "arama metni"
}

5. fill_form ⭐ 新

同时填写多个表单字段。

{
  "fields": [
    {
      "selector": "input#name",
      "value": "John Doe"
    },
    {
      "selector": "input#email",
      "value": "john@example.com"
    },
    {
      "selector": "input#phone",
      "value": "+90 555 123 4567"
    }
  ],
  "wait_time": 500
}

6. select_option ⭐ 新

从 Select dropdown 中选择一个选项。

{
  "selector": "select#country",
  "value": "TR"
}

7. check_element ⭐ 新

选择/取消复选框或无线电按钮。

{
  "selector": "input[type='checkbox']#terms",
  "checked": true
}

8. screenshot

获取页面的截图。

{
  "path": "screenshot.png"
}

9. get_html

返回页面的HTML代码。

10. close_browser

关闭浏览器。

🚀 安装

1. 转到项目文件夹

cd /Users/mustafahudaiakgul/playwright-mcp

2. 加载依赖关系

npm install

3. 启动服务器

npm start

或在开发模式：

npm run dev

📝 使用

Cursor/Claude MCP 集成

mcp.json 在文件中 Playwright 服务器处于活动状态：

{
  "llm": {
    "provider": "openai",
    "model": "gpt-4"
  },
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["@playwright/mcp@latest"]
    }
  }
}

Örnek自动化

import { chromium } from 'playwright';

const browser = await chromium.launch();
const page = await browser.newPage();

// Google'a git
await page.goto('https://www.google.com');

// Arama yap
await page.fill('input[name="q"]', 'Playwright');
await page.press('input[name="q"]', 'Enter');

// Sonuçları al
const results = await page.locator('div.g a').allTextContents();
console.log(results);

await browser.close();

📚 例子

例子 examples/ 在文件夹中：

  • basic-automation.js - 简单的搜索自动化
  • form-filling.js 表单填写示例（文本，下拉菜单，复选框）

🔧 配置

环境变量

.env 在文件中：

BROWSER_TYPE=chromium
HEADLESS=true
TIMEOUT=30000

🎯 使用场景

  1. Web剪贴： 结构化数据提取
  2. 测试自动化编写和运行 E2E 测试
  3. Web 开发从网站收集信息
  4. 填写表格自动填写表格
  5. 验证在网页上验证

📖 资源

📄 许可证

国际协调委员会

对于问题或贡献： 您可以打开GitHub问题。

相关 MCP