2025年5月21日水曜日

Windows11 で mcp server puppetter を使ってみた

概要
環境
mcpo 環境構築
puppetter のインストール
mcpo の設定
mcpo 起動
open-webui の設定
動作確認
トラブルシューティング
最後に
参考サイト

概要

mcpo で mcp-server-puppetter を動かす方法を紹介します

環境

Windows11 24H2 (26100.4061)
Python 3.12.10
node 22.15.1
- puppetter 24.8.2
LLM (gpt4o-mini with open-webui

mcpo 環境構築

mcpo を動かすために Python 環境を構築します
Powershell で操作します

Set-ExecutionPolicy RemoteSigned -Scope Process
Invoke-WebRequest -UseBasicParsing -Uri "https://raw.githubusercontent.com/pyenv-win/pyenv-win/master/pyenv-win/install-pyenv-win.ps1" -OutFile "./install-pyenv-win.ps1"; &"./install-pyenv-win.ps1"
pyenv install 3.12.10
mkdir python_work
cd python_work
pyenv local 3.12.10
pip install pipenv
pipenv install mcpo

puppetter のインストール

nvm を使ってインストールします
https://github.com/coreybutler/nvm-windows/releases から Windows 用の nvm をインストールします

cd python_work
nvm install 22.15.1
nvm use 22.15.1
$Env:PUPPETEER_SKIP_DOWNLOAD = "skip"
$Env:NODE_TLS_REJECT_UNAUTHORIZED = "0"
npm install -g puppeteer
npm install puppeteer
npx puppeteer browsers install chrome

mcpo の設定

vim config.json

{
  "mcpServers": {
    "puppeteer": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-puppeteer"]
    }
  }
}

mcpo 起動

pipenv run mcpo --port 8000 --host 127.0.0.1 --config .\config.json --api-key "top-secret"

Starting MCP OpenAPI Proxy with config file: .\config.json
2025-05-19 14:35:08,611 - INFO - Starting MCPO Server...
2025-05-19 14:35:08,611 - INFO -   Name: MCP OpenAPI Proxy
2025-05-19 14:35:08,611 - INFO -   Version: 1.0
2025-05-19 14:35:08,611 - INFO -   Description: Automatically generated API from MCP Tool Schemas
2025-05-19 14:35:08,611 - INFO -   Hostname: fjct-1267
2025-05-19 14:35:08,611 - INFO -   Port: 8000
2025-05-19 14:35:08,611 - INFO -   API Key: Provided
2025-05-19 14:35:08,611 - INFO -   CORS Allowed Origins: ['*']
2025-05-19 14:35:08,611 - INFO -   Path Prefix: /
2025-05-19 14:35:08,611 - INFO - Loading MCP server configurations from: .\config.json
2025-05-19 14:35:08,621 - INFO - Configured MCP Servers:
2025-05-19 14:35:08,621 - INFO -   Configuring Stdio MCP Server 'puppeteer' with command: npx with args: ['-y', '@modelcontextprotocol/server-puppeteer']
2025-05-19 14:35:08,621 - INFO - Uvicorn server starting...
INFO:     Started server process [2896]
INFO:     Waiting for application startup.
INFO:     Application startup complete.
INFO:     Uvicorn running on http://127.0.0.1:8000 (Press CTRL+C to quit)

Waiting for application startup. で止まる場合は puppetter がうまくインストールできておらず裏で動作していない可能性があります

open-webui の設定

http://127.0.0.1:8000/puppetter を接続に追加しましょう

動作確認

open-webui から質問します
これがかなり大変でした
アバウトな質問だとボタンやフォームが全く検索できないので結構しっかりとした質問にしなければ意図した動きをするのは難しいかなと思います

例えば Google で検索するだけでも以下のような質問が必要でした

puppeteer mcp を使ってブラウザを立ち上げてgoogle.comにアクセスしてhawksnowlogと検索してください、launchOptions で executablePath に "C:\Program Files\Google\Chrome\Application\chrome.exe" を使用してください、google.com にアクセス出来たら検索ボックスに hawksnowlog と入力し検索ボタンを押して下さい、検索ボックスの id は #APjFqb です

同じ質問でも動かないケースがあるのでかなり不安定でした

トラブルシューティング

Error: Could not find Chrome

なぜか puppetter からデフォルトの chrome.exe が見えないことがあるようです
puppetter 起動時に launchOptions で executablePath というオプションがあるので LLM の質問を使ってうまくこのオプションを指定するようにしましょう

最後に

Windows11 上に mcp-server-puppetter をインストールして試してみました
質問をかなり工夫しないと思ったように動かないのでまだまだ発展途中かなと思います

LLM を変えたり別の mcp-server を使うのもありですが現状てっとり早いのは puppetter のコードをチャットで書いてもらって自分で実行するのが一番確実で速いと思います

hawksnowlog