mcpField
P
playwright-sse-mcp-server

playwright-sse-mcp-server

本地服务
github.com/torohash浏览器自动化781 周前更新

关于 playwright-sse-mcp-server

playwright-sse-mcp-server 将 Playwright 作为 MCP 服务提供,通过 SSE 接受客户端连接。它面向需要在 Docker 环境中远程调用无头浏览器操作的 MCP 用户。

主要功能

  1. 01通过 SSE 提供 MCP 连接
  2. 02以无头模式运行 Playwright
  3. 03支持自定义服务端口
  4. 04提供启动、停止和日志脚本

适用场景

  1. 01从 MCP 客户端执行浏览器操作
  2. 02在 Docker 容器间连接 Playwright
  3. 03从开发容器经由主机连接服务

MCP 相关

该项目将 Playwright 功能暴露为 MCP 服务,使用 SSE 与 MCP 客户端通信。

配置

本地服务的配置在各客户端中通用,复制后粘贴到客户端的 MCP 配置文件即可。

mcp.json · 通用配置
{
"mcpServers": {
"playwright-sse": {
"command": "docker",
"args": [
"run",
"-i",
"--rm",
"network"
]
}
}
}
启动命令docker run -i --rm network

本地服务需要在你的电脑上安装运行环境(如 Node.js 18+)。各客户端的配置文件位置不同,请参考客户端文档。

安装包
ocinetwork

工具

还没有获取到工具列表

本地服务需要在你的电脑上运行后才能读取工具,维护者暂未提供工具列表。

详细介绍

playwright-sse-mcp-server

此服务将 Playwright 作为 MCP(Model Context Protocol)服务提供。使用此服务,MCP 客户端即可使用 Playwright 的功能。

前提条件

  • 已安装 Docker
  • 已安装 docker-compose
  • 已创建名为 mcp-network 的 Docker 网络

如果 mcp-network 不存在,可以使用以下命令创建:

docker network create mcp-network

设置和启动方法

  1. 克隆或下载仓库
  2. 在项目根目录中运行以下命令:
docker compose up --build

这样会在默认的 3002 端口启动服务。启动完成后,会显示如下消息:

playwright-sse-mcp-server  | Server is running on port 3002
设置自定义端口

如果要使用默认端口(3002)以外的端口启动服务,请设置环境变量PORT:

PORT=4000 docker compose up --build

这样会在指定端口(此例中为 4000)启动服务:

playwright-sse-mcp-server  | Server is running on port 4000

使用方法

从加入同一 mcp-network 的容器连接

其他加入同一 mcp-network 的容器可通过以下 URL 连接到服务(PORT为服务启动端口):

playwright-sse-mcp-server:${PORT}/sse

使用默认端口时:

playwright-sse-mcp-server:3002/sse

这样即可使用 Playwright 的 MCP 功能。

从主机连接

从主机可通过以下 URL 连接到服务(PORT为服务启动端口):

localhost:${PORT}/sse

使用默认端口时:

localhost:3002/sse
从 Roo Code 连接

MCP Servers -> 编辑 MCP 设置 -> 填写以下内容(PORT为服务启动端口):

{
  "mcpServers": {
    "playwright-sse-mcp-server-local": {
      "url": "http://localhost:${PORT}/sse"
    }
  }
}

使用默认端口时:

{
  "mcpServers": {
    "playwright-sse-mcp-server-local": {
      "url": "http://localhost:3002/sse"
    }
  }
}

※截至 2025/03/27,Cline 不支持 SSE,因此无法使用。

在容器环境中从 Roo Code 连接

从运行在同一 Docker Network 中的 Roo Code 容器连接时,请按如下方式设置 MCP:

{
  "mcpServers": {
    "playwright-sse-mcp-server-local": {
      "url": "http://playwright-sse-mcp-server:3002/sse"
    }
  }
}

docker-compose.yml 设置示例:

services:
  # Roo Code コンテナ
  roo-code:
    # 略

networks:
  mcp-network:
    external: true

此设置使 Roo Code 容器能够连接到 playwright-sse-mcp-server 容器并使用浏览器操作功能。将容器名称(playwright-sse-mcp-server)用作主机名,即可在 Docker Network 中解析名称。

在开发容器环境中从 Roo Code 连接(经由主机)

如果在开发容器中运行 Roo Code,且不加入 mcp-network,而是经由主机连接到此 MCP 服务,请按如下方式设置 MCP。

Docker Desktop (Mac/Windows) 的情况:

{
  "mcpServers": {
    "playwright-sse-mcp-server-local": {
      "url": "http://host.docker.internal:<PORT>/sse"
    }
  }
}

Linux 的情况(例如:使用桥接网关 IP):

{
  "mcpServers": {
    "playwright-sse-mcp-server-local": {
      "url": "http://172.17.0.1:<PORT>/sse"
    }
  }
}

注意:

  • 请将 <PORT> 替换为 MCP 服务在主机上公开的端口号(默认:3002)。
  • 在 Linux 中,请将 172.17.0.1 替换为实际的主机 IP 地址或 Docker 桥接网络的网关 IP 地址。详情请参阅“从开发容器连接(经由主机)”一节。
从开发容器连接(经由主机)

如果需要从未加入 mcp-network 的开发容器访问此 MCP 服务(例如,因现有项目的限制而难以更改网络),可以经由主机连接。

此方法需要指定开发容器所见的“主机”IP 地址或特殊 DNS 名称,以及 MCP 服务在主机上公开的端口(在 compose.yml 的 ports 中设置,默认为 3002)。

连接 URL:

http://<host_ip_or_dns_name>:<PORT>/sse

请将 <PORT> 替换为 MCP 服务启动时使用的端口号。

如何确定 <host_ip_or_dns_name>:

  • Docker Desktop (Mac/Windows): 可以使用特殊 DNS 名称 host.docker.internal。
    • 例:http://host.docker.internal:3002/sse
  • Linux:
    • 主机 IP 地址: 使用分配给主机网络接口的 IP 地址(例如,通过 ifconfig 或 ip addr 命令确认)。
      • 例:http://192.168.1.10:3002/sse(IP 地址因环境而异)
    • Docker 桥接网络的网关: 可以使用 Docker 默认桥接网络 (bridge) 的网关 IP 地址(通常为 172.17.0.1)。可以通过 docker network inspect bridge 命令确认。
      • 例:http://172.17.0.1:3002/sse

注意事项:

  • 根据主机防火墙设置,可能不允许开发容器访问主机端口。
  • 请通过 docker compose ps 命令或 compose.yml 文件确认所使用的端口号。

便捷的使用方法

每次都切换到项目目录并运行 docker compose 命令很麻烦。使用以下方法,可以在任何位置轻松启动或停止服务。

使用 Shell 脚本的方法

此项目包含用于轻松启动、停止服务和查看日志的 Shell 脚本。

  1. 克隆或下载项目:
# 任意のディレクトリにクローン
git clone https://github.com/torohash/playwright-sse-mcp-server.git /path/to/installation
  1. 将以下内容添加到 .bashrc(或.zshrc等所用 Shell 的配置文件),以加载 Shell 脚本:
# Playwright MCP Server
export PLAYWRIGHT_MCP_HOME="/path/to/installation"
source "$PLAYWRIGHT_MCP_HOME/scripts/playwright-mcp.sh"

# 具体例(絶対パス利用)
export PLAYWRIGHT_MCP_HOME="$HOME/mcps/playwright-sse-mcp-server"  # 実際のパスに置き換えてください
source "$PLAYWRIGHT_MCP_HOME/scripts/playwright-mcp.sh"
  1. 重启 Shell,或重新加载配置文件:
source ~/.bashrc

之后,无论身处何处,都可以使用以下命令:

基本用法
  • playwright-mcp-start - 使用默认设置(端口 3002,不重启)启动服务
  • playwright-mcp-stop - 停止服务
  • playwright-mcp-logs - 显示服务日志
使用持久模式

使用持久模式后,系统重启时服务会自动启动:

playwright-mcp-start -p
# または
playwright-mcp-start --persistent
使用自定义端口
playwright-mcp-start -P 4000
# または
playwright-mcp-start --port 4000
组合使用持久模式和自定义端口
playwright-mcp-start -P 4000 -p
# または
playwright-mcp-start --port 4000 --persistent
指定特定的重启策略
playwright-mcp-start -r always
# または
playwright-mcp-start --restart always
显示帮助
playwright-mcp-start -h
# または
playwright-mcp-start --help

此方法支持使用标志选项灵活更改设置,因此更加便捷。此外,将 Shell 脚本分离到单独的文件中,可以让 .bashrc 文件保持简洁,更易于管理。

自定义 Shell 脚本

Shell 脚本位于scripts/playwright-mcp.sh。可根据需要编辑此文件进行自定义。

环境变量

Shell 脚本使用以下环境变量:

  • PLAYWRIGHT_MCP_HOME:项目安装目录。如果未设置,将根据脚本位置自动检测。

例如,可以通过设置环境变量指定自定义路径:

export PLAYWRIGHT_MCP_HOME="/path/to/custom/installation"

注意事项

  • 此服务以 headless 模式运行 Playwright
  • 服务使用 SSE(Server-Sent Events)与 MCP 客户端通信

评论

支持 Markdown

第一次接触 MCP?

从协议是什么,到在客户端里装上第一个服务,这几条回答覆盖了大多数入门问题。

一个开放协议,规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话,MCP 服务负责提供工具、资源和提示模板,两者通过标准消息通信,同一个服务可以被不同客户端复用。