Playwright MCP Docker Environment

这个项目提供了一个 Docker Compose 环境来运行 '@playwright/mcp' 服务器。

iuill

开发者工具

README

本项目提供一个 Docker Compose 环境来运行 @playwright/mcp 服务器。它允许你轻松设置和管理 Playwright MCP 服务器，以便与 Cline 或 Cursor 等客户端一起使用。

克隆仓库：

git clone <repository-url>
cd playwright-mcp-docker

创建 .env 文件： 复制示例环境变量文件：
```
cp .env.sample .env
```
配置 .env： 编辑 .env 文件，根据你的环境和偏好调整设置：
- MCP_HOST_PORT：主机上 MCP 服务器可通过访问的端口（默认：8931）。
- HEADLESS：设置为 true 表示无头模式（没有浏览器 GUI），或设置为 false 表示有头模式（需要 GUI 设置）。默认为 true。
- (仅有头模式) DISPLAY、WAYLAND_DISPLAY、XDG_RUNTIME_DIR：Linux 环境（尤其是 WSLg）中 GUI 应用程序需要的环境变量。提供默认值。
- (仅有头模式) X11_HOST_PATH、WSLG_HOST_PATH：X11 和 WSLg 套接字/目录的主机路径。提供默认值。如果你的系统配置不同，请调整。对于 Windows Docker 访问 WSL 路径，请使用 \\wsl.localhost\DistroName\... 格式（参见 .env.sample）。

构建并启动容器：
```
docker-compose up --build -d
```
--build 标志仅在第一次或 Dockerfile 更改时需要。-d 标志在分离模式（后台）下运行容器。
配置 MCP 客户端（例如，VSCode/Cline）：
- 添加或启用一个名为 playwright_sse（或你喜欢的任何名称）的 MCP 服务器。
- 将连接类型设置为 SSE。
- 将 URL 设置为 http://localhost:<MCP_HOST_PORT>/sse（将 <MCP_HOST_PORT> 替换为你 .env 文件中的值，例如 http://localhost:8931/sse）。
- 客户端配置示例（文件名取决于客户端）：
```
{
  "mcpServers": {
    "playwright_sse": { // 服务器名称是任意的
      "url": "http://localhost:8931/sse" // 匹配 .env 文件中的端口号
    }
  }
}
```

.env 文件： 管理特定于环境的设置，如端口、无头模式和有头模式的路径。
docker-compose.yml： 定义 Docker 服务，从 .env 读取变量，设置端口映射和卷。
Dockerfile： 定义 Docker 镜像，安装 @playwright/mcp 及其依赖项（包括 Chrome）。
entrypoint.sh： 容器启动时运行的脚本，根据 HEADLESS 环境变量将正确的参数（--headless 或 --port）传递给 npx @playwright/mcp 命令。

无头模式： 在 .env 中设置 HEADLESS=true。重启容器：docker-compose up -d。
有头模式： 在 .env 中设置 HEADLESS=false。确保你的主机环境（例如，WSLg 或 X Server）已正确设置。重启容器：docker-compose up -d。

如果你在 Windows 上使用 WSLg，则 docker-compose.yml 中的默认设置和 .env.sample 中的 WSL2 特定路径通常应该有效。如果你的 WSL 发行版名称不是 Ubuntu，请确保 .env 中的路径与你的 WSL 发行版名称匹配。
如果你未使用 WSLg（例如，标准 Linux 桌面或带有单独 X Server 的 macOS/Windows），则需要根据你的 X Server 设置调整 DISPLAY 变量，并可能调整 .env 文件中的卷挂载（X11_HOST_PATH）。