playwright-server MCP 服务器

这是一个集成了 Playwright 工具的 MCP (Model Context Protocol) 服务器。

组件

服务器包含以下主要组件：

资源 (Resources)

该服务器实现了一个简单的笔记存储系统，具有以下特性：

• 自定义 note:// URI 方案: 用户可以通过类似 URL 的方式（使用 note:// 前缀）访问单个笔记资源。
• 笔记资源结构: 每个笔记资源包含一个名称（name）、一个描述（description）以及 text/plain 的 MIME 类型。这意味着笔记内容被视为纯文本。

提示 (Prompts)

服务器提供一个主要的提示功能：

• summarize-notes: 用于创建所有已存储笔记的摘要。
  • 支持一个可选的 style 参数，用于控制摘要的详细程度（brief 代表简洁，detailed 代表详细）。
  • 服务器会结合当前所有笔记的内容和用户指定的详细程度偏好，生成用于摘要的提示。

工具 (Tools)

服务器实现了以下基于 Playwright 的工具，允许通过 MCP 协议与网页进行交互自动化：

• playwright_navigate:
  • 功能：导航到指定的 URL。如果当前没有活动的浏览器会话，此操作会自动创建一个新的会话。
  • 参数：需要一个必需的 url 参数 (字符串类型)，指定要访问的网址。
• playwright_screenshot:
  • 功能：截取当前页面或页面上特定元素的屏幕截图。
  • 参数：
    • 需要一个必需的 name 参数 (字符串类型)，用于指定截图文件的名称。
    • 支持一个可选的 selector 参数 (字符串类型)，用于指定要截图的元素的 CSS 选择器。如果未提供此参数，则会截取整个页面的截图。
• playwright_click:
  • 功能：使用 CSS 选择器点击页面上的一个元素。
  • 参数：需要一个必需的 selector 参数 (字符串类型)，指定要点击元素的 CSS 选择器。
• playwright_fill:
  • 功能：填充输入字段。
  • 参数：
    • 需要一个必需的 selector 参数 (字符串类型)，指定输入字段的 CSS 选择器。
    • 需要一个必需的 value 参数 (字符串类型)，指定要填充到输入字段的值。
• playwright_evaluate:
  • 功能：在浏览器控制台中执行 JavaScript 代码。
  • 参数：需要一个必需的 script 参数 (字符串类型)，指定要执行的 JavaScript 代码字符串。
• playwright_click_text:
  • 功能：通过元素的文本内容点击页面上的一个元素。
  • 参数：需要一个必需的 text 参数 (字符串类型)，指定要点击元素的可见文本内容。
• playwright_get_text_content:
  • 功能：获取页面上所有可见元素的文本内容。
  • 参数：无。
• playwright_get_html_content:
  • 功能：获取页面上特定元素的 HTML 内容。
  • 参数：需要一个必需的 selector 参数 (字符串类型)，指定要获取 HTML 内容的元素的 CSS 选择器。

配置 (Configuration)

[待办：添加特定于此实现的配置详情]
此部分保留用于记录服务器的特定配置选项和设置方法，例如端口、日志级别等。

快速开始 (Quickstart)

要开始使用此服务器，通常需要先配置 MCP 客户端，例如 Claude Desktop。

1. 安装 Claude Desktop:

   • 在 MacOS 上，配置文件通常位于 ~/Library/Application\ Support/Claude/claude_desktop_config.json。
   • 在 Windows 上，配置文件通常位于 %APPDATA%/Claude/claude_desktop_config.json。

2. 开发/未发布服务器配置:
   如果您正在本地开发或使用未发布的服务器版本，请将以下配置块添加到您的 Claude Desktop 配置文件的 mcpServers 部分：
   json
"mcpServers": {
"playwright-server": {
"command": "uv",
"args": [
"--directory",
"C:\Users\xxxxx\Documents\project\python\mcp\playwright-server",
"run",
"playwright-server"
]
}
}
   这段配置指示 Claude Desktop 使用 uv 命令，在指定的项目目录下运行名为 playwright-server 的脚本来启动服务器。请将路径替换为您实际的项目路径。

3. 已发布服务器配置:
   如果服务器已经发布并安装，可以使用更简洁的配置：
   json
"mcpServers": {
"playwright-server": {
"command": "uvx",
"args": [
"playwright-server"
]
}
}
   此配置使用 uvx 命令直接执行已安装的 playwright-server 可执行文件。

开发 (Development)

如果您是服务器的开发者，以下是一些常用的开发命令：

• 构建和发布:
  要准备软件包进行分发：
  • uv sync: 同步项目依赖项并更新锁定文件，确保环境一致。
  • uv build: 构建软件包分发文件。这会在 dist/ 目录下创建源代码分发文件 (.tar.gz) 和 wheel 分发文件 (.whl)。
  • uv publish: 将构建好的软件包发布到 PyPI。
    • 注意：发布到 PyPI 需要设置身份验证凭据，可以通过环境变量或命令行参数提供，例如：
      • 使用 Token: --token 参数或 UV_PUBLISH_TOKEN 环境变量。
      • 使用用户名/密码: --username / UV_PUBLISH_USERNAME 和 --password / UV_PUBLISH_PASSWORD 环境变量或参数。

调试 (Debugging)

由于 MCP 服务器通常通过标准输入/输出 (stdio) 进行通信，直接调试可能会比较困难。为了获得最佳的调试体验，强烈建议使用 MCP Inspector。

您可以通过 npm 使用以下命令启动 MCP Inspector 并连接到您的服务器：
bash
npx @modelcontextprotocol/inspector uv --directory C:\Users\YUNYING\Documents\project\python\mcp\playwright-server run playwright-server
此命令会启动 MCP Inspector，并将您的服务器作为其子进程运行。启动后，Inspector 会显示一个 URL，您可以在浏览器中访问该 URL 以开始图形化的调试会话，查看 MCP 消息的发送和接收情况。