Playwright MCP服务

一个可部署在Azure Container Apps上的Docker镜像,提供基于Playwright的远程MCP服务器功能,支持SSE和HTTP流传输。

  • by simonjj
  • Dockerfile
  • 混合部署
  • 1 星标
  • 更新于
在 GitHub 查看 simonjj/playwright-mcp-on-aca

使用说明

Azure容器应用程序上的剧作家MCP

一个已准备好部署的Docker镜像,可以运行 剧作家 作为一个遥控器 MCP(模型上下文协议) 服务器。专为Azure容器应用程序(ACA)设计,但适用于Docker运行的任何地方。

建筑

MCP Client <--SSE/HTTP--> mcp-proxy (:8080) <--stdio--> @playwright/mcp <--CDP--> Chromium (headless)
组件 角色
@剧作家/mcp 剧作家MCP服务器(stdio传输)
mcp代理 封装stdio服务器并通过SSE和Streamable HTTP公开它
Chromium 无头浏览器引擎

这 mcp-proxy 暴露两个端点:

  • /sse --服务器发送事件传输
  • /mcp --可流式HTTP传输

先决条件

  • Docker(或WSL上的Docker桌面/Docker)
  • 对于ACA部署:Azure CLI containerapp 扩展

快速开始

构建

docker build -t playwright-mcp .

跑

docker run -d -p 8080:8080 --name playwright-mcp playwright-mcp

MCP服务器现在可以在以下位置访问:

  • 上海证券交易所 http://localhost:8080/sse
  • 流式HTTP: http://localhost:8080/mcp

使用Docker Compose

docker compose up -d --build

配置

所有配置都是通过环境变量完成的。

变量 默认值 描述
MCP_PORT 8080 MCP代理监听的端口
MCP_HOST 0.0.0.0 MCP代理绑定到的主机地址

复制 .env.example 到 .env 在使用Docker Compose时自定义这些值。

连接MCP客户端

VS代码/GitHub副本

添加到您的 .vscode/mcp.json:

{
  "servers": {
    "playwright-remote": {
      "type": "sse",
      "url": "http://localhost:8080/sse"
    }
  }
}

克劳德桌面版

添加到您的Claude Desktop MCP配置中:

{
  "mcpServers": {
    "playwright": {
      "command": "mcp-proxy",
      "args": ["http://localhost:8080/sse"]
    }
  }
}

注意:Claude Desktop需要 mcp-proxy 本地安装(pip install mcp-proxy)从stdio桥接到远程SSE服务器。

任何与SSE兼容的客户端

向您的客户指出 http://<host>:8080/sse 对于SSE运输或 http://<host>:8080/mcp 用于流式HTTP。

部署到Azure容器应用程序

1.设置变量

RESOURCE_GROUP="rg-playwright-mcp"
LOCATION="eastus"
ENVIRONMENT="playwright-mcp-env"
APP_NAME="playwright-mcp"
REGISTRY="<your-acr-name>.azurecr.io"
IMAGE_TAG="$REGISTRY/playwright-mcp:latest"

2.建立和推广形象

az acr build --registry <your-acr-name> --image playwright-mcp:latest .

或者在本地构建并推送:

docker build -t $IMAGE_TAG .
docker push $IMAGE_TAG

3.创建容器应用程序

az containerapp env create \
  --name $ENVIRONMENT \
  --resource-group $RESOURCE_GROUP \
  --location $LOCATION

az containerapp create \
  --name $APP_NAME \
  --resource-group $RESOURCE_GROUP \
  --environment $ENVIRONMENT \
  --image $IMAGE_TAG \
  --target-port 8080 \
  --ingress external \
  --cpu 1.0 \
  --memory 2.0Gi \
  --min-replicas 0 \
  --max-replicas 3 \
  --registry-server $REGISTRY

4.获取应用程序URL

az containerapp show \
  --name $APP_NAME \
  --resource-group $RESOURCE_GROUP \
  --query properties.configuration.ingress.fqdn \
  --output tsv

MCP服务器将在 https://<fqdn>/sse.

图像细节

  • 基础图像: node:22-bookworm-slim
  • 浏览器: 仅限Chromium(通过Playwright安装)
  • 运行时间: Node.js 22+Python 3(用于mcp代理)
  • 用户: 以非root身份运行(mcpuser,UID 1001)
  • 默认端口: 8080

发展

更改后重建

docker compose up -d --build

查看日志

docker compose logs -f

测试服务器

使用 MCP检查员 验证服务器是否正常工作:

npx @modelcontextprotocol/inspector

然后连接到 http://localhost:8080/sse 从检查器UI。

故障排除

集装箱立即出口 检查日志 docker logs playwright-mcp。常见原因包括端口冲突或缺少依赖关系。

端口8080上的连接被拒绝 验证容器是否正在运行以及端口映射是否正确。在容器内部,服务器绑定到 0.0.0.0:8080 默认情况下。

浏览器启动失败 该映像会自动安装Chromium系统依赖项。如果在最小主机上运行,请确保容器有足够的内存(建议至少512 MB,ACA为2 GB)。