Виграй 1 ТБ резидентного трафіку, iPhone 18 Pro Max + ще 33 призи$50 на баланс = 1 квитокПриєднатись
Бізнес

Налаштування Playwright MCP у Claude Code: керування браузером і підключення проксі

Звичайні скрипти для парсингу й автотестів часто падають, щойно сайт трохи оновить верстку або перейменує класи в коді. Підключення пакета playwright-mcp до консольного клієнта Claude Code розв'язує цю проблему. Через протокол Model Context Protocol (MCP) браузер передає нейромережі готову текстову схему сторінки. Підбирати CSS-селектори вручну чи пересилати в модель важкі скриншоти більше не потрібно. Тестувальники (QA), розробники парсерів і аналітики керують браузерами Chromium, Firefox, WebKit і Microsoft Edge просто з терміналу, спрямовуючи запити через проксі.

Коротко про головне: як працює зв'язка Claude Playwright MCP

  • Принцип роботи: пакет playwright-mcp передає в Claude Code легке текстове дерево доступності Playwright MCP (browser_snapshot) замість картинок і заощаджує до 80% токенів.

  • Встановлення однією командою: консольна команда claude mcp add playwright -- npx @playwright/mcp@latest реєструє офіційний playwright mcp server для однієї теки, командного проєкту або всього комп'ютера.

  • Розділення профілів: запуск із прапорцем --isolated разом із файлом кук --storage-state (або окремими теками --user-data-dir) дає змогу відкривати кілька браузерів паралельно без конфліктів блокування кешу.

  • Робота через проксі: параметри --proxy-server і HTTP_PROXY у файлі .mcp.json спрямовують трафік браузера через мобільні LTE/5G, статичні резидентські ISP або ротаційні резидентські проксі.

  • Перевірка IP до запуску: перед стартом парсингу чи тестів чистоту IP-адреси легко перевірити через вбудований чекер Fraud Score в особистому кабінеті CyberYozh App.

👉 Перейти до каталогу проксі CyberYozh App з вибором за країнами й типами провайдерів

Що робить Playwright MCP всередині браузера

Щоб зрозуміти, що робить Playwright MCP на практиці, порівняємо способи читання веб-сторінки. Колишні візуальні ШІ-агенти робили скриншот екрана й клікали за приблизними координатами X та Y. Варто було з'явитися рекламному банеру або зсунутися мобільній верстці - агент схибляв повз кнопку.

Офіційний playwright mcp server від Microsoft (пакет @playwright/mcp) працює безпосередньо з DOM. За командою browser_snapshot він зчитує дерево доступності Playwright MCP (accessibility tree), де кожній кнопці, посиланню та полю введення призначено роль і коротку точну мітку: наприклад, поле пошуку textbox "Пошук за каталогом" [ref=e5] або кнопка button "Застосувати фільтр" [ref=e12]. Щоб ввести текст або клікнути, Claude Code передає мітку ref=e5 у команду browser_type або browser_click. Схибити за координатами неможливо. Паралельно сервер відстежує фонові запити сайту до API (browser_network_requests), читає логи консолі розробника (browser_console_messages), перемикає вкладки та вивантажує сторінку в PDF або скриншот.

Такий підхід поєднує три етапи збирання даних. Звичайний веб-скрейпинг завантажує вихідний HTML-код за посиланням. Скрін-скрейпинг (screen scraping, або скрейпинг екрана) зчитує дані з візуального інтерфейсу (відрендереного DOM у браузері, старої програми на ПК чи картинки через OCR). А парсинг розбирає й очищає знайдені поля для вивантаження в CSV, Excel або XML-фід. З сервером playwright-mcp нейромережа читає живу сторінку одразу після виконання клієнтського JavaScript і забирає структуровані дані без ручного складання селекторів.

👉 Дослідити проксі-інфраструктуру для ШІ-агентів і браузерної автоматизації в CyberYozh App

Як використовувати Playwright MCP з Claude Code в терміналі

Перш ніж використовувати Playwright MCP з Claude Code на робочих проєктах, перевірте на комп'ютері три базові компоненти: встановлений Node.js версії 18 або новіший (рекомендовано 20+ LTS), авторизований консольний клієнт Claude Code (@anthropic-ai/claude-code) та активні доступи до проксі для захисту від лімітів на часті запити.

Як додати Playwright MCP до Claude Code: три режими налаштування

Щоб додати Playwright MCP до Claude Code, виконайте одну команду в терміналі. Прапорець --scope задає область дії: лише для поточної теки (local), у спільному файлі проєкту для команди (project) або глобально для всіх тек на комп'ютері (user). Якщо імена збігаються, локальні налаштування теки завжди перекривають командні та глобальні.

Режим налаштування (Scope)

Прапорець у команді

Де зберігається файл налаштувань

Коли використовувати

Локальний (Local)

За замовчуванням (без прапорця)

~/.claude.json (у розділі поточної теки)

Найвищий пріоритет; прив'язує окремий тестовий проксі лише до однієї робочої теки

Командний (Project)

--scope project

.mcp.json (у корені проєкту)

Середній пріоритет; зберігається в Git-репозиторії, щоб уся команда мала єдині налаштування

Глобальний (User)

--scope user

~/.claude.json (загальний профіль)

Базовий пріоритет; робить playwright-mcp доступним одразу в усіх проєктах на комп'ютері

Виконайте ці команди в терміналі, щоб перевірити версії програм, заздалегідь завантажити браузер Chromium і зареєструвати сервер у потрібному режимі:

bash
# 1. Проверка установленных версий Node.js и Claude Code
node --version
claude --version

# 2. Предварительная установка пакета и браузера Chromium
npx @playwright/mcp@latest --version
npx playwright install chromium

# 3. Регистрация сервера (выберите один из трёх вариантов)
# Вариант А: только для текущей открытой папки
claude mcp add playwright -- npx @playwright/mcp@latest

# Вариант Б: глобально для всех ваших проектов на компьютере
claude mcp add playwright --scope user -- npx @playwright/mcp@latest

# Вариант В: создание общего файла .mcp.json в корне проекта для команды
claude mcp add playwright --scope project -- npx @playwright/mcp@latest

# 4. Проверка списка подключённых MCP-серверов
claude mcp list

Для перевірки мобільної адаптивності замість стандартного пакета можна встановити збірку ExecuteAutomation (@executeautomation/playwright-mcp-server) з готовими профілями екранів під 143 моделі смартфонів і моніторів. А для швидкого парсингу сайтів через Claude AI без ручного редагування конфігів підійде наш безкоштовний опенсорсний інструмент Yozh Scraper на GitHub - він автоматично спрямовує запити через проксі з вашого кабінету CyberYozh App.

👉 Підібрати мобільні та статичні ISP-проксі з безлімітним трафіком для веб-скрейпингу

Налаштування Playwright MCP і проксі для Playwright MCP у файлі .mcp.json

Коли базове налаштування Playwright MCP у терміналі завершено, прив'яжемо до браузера зовнішню мережеву адресу. Якщо ви через консоль перевіряєте посадкові сторінки реклами в інших країнах, звіряєте регіональні ціни або парсите картки товарів у каталогах, часті запити з одного офісного IP швидко викликають капчу. Щоб підключити проксі для Playwright MCP, пропишіть адресу шлюзу та доступи у файлі .mcp.json (або в глобальному файлі ~/.claude.json):

json
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "-y",
        "@playwright/mcp@latest",
        "--browser",
        "chromium",
        "--isolated",
        "--proxy-server=http://proxy.cyberyozh.com:8080"
      ],
      "env": {
        "HTTP_PROXY": "http://username:password@proxy.cyberyozh.com:8080",
        "HTTPS_PROXY": "http://username:password@proxy.cyberyozh.com:8080",
        "PLAYWRIGHT_MCP_PING_TIMEOUT_MS": "15000"
      }
    }
  }
}

Зверніть увагу: адреса сервера (proxy.cyberyozh.com), порт (8080), логін і пароль у прикладі вище наведено для зразка. Під час налаштування підставте актуальний хост, порт і дані для входу з картки вашого купленого проксі в особистому кабінеті CyberYozh App.

Як керувати профілями браузера, файлами cookie та IP-адресою проксі

Щоб під час паралельного запуску кількох завдань браузер не падав із помилкою, а сайти не скидали авторизацію, розділяйте два незалежні механізми:

  1. Зберігання кук і сесій браузера: за замовчуванням сервер playwright-mcp пише всі файли cookie в одну спільну системну теку на диску. Якщо спробувати відкрити друге вікно терміналу Claude Code і запустити ще один браузер паралельно, виникне помилка блокування цієї теки. Для одночасної роботи кількох вікон вмикайте ізольований профіль Playwright MCP прапорцем --isolated (створює чисте середовище в оперативній пам'яті), а збережені куки авторизації підвантажуйте в такий ізольований профіль Playwright MCP через параметр --storage-state=./auth.json. Якщо ж під проєкт потрібен постійний профіль на диску, задайте для нього окрему теку прапорцем --user-data-dir.

  2. Сталість IP-адреси проксі: збережені куки та зовнішній IP працюють у парі, але не замінюють один одного. Сталий IP не подовжить токен у куках, що сплив, а збережені куки не врятують від скидання сесії, якщо посеред оформлення замовлення змінився зовнішній IP. Враховуйте й особливість Chromium: стандартний прапорець --proxy-server приймає логін і пароль лише для протоколу HTTP/HTTPS. Канали SOCKS5 безпосередньо в Chromium працюють лише без пароля (за прив'язкою до вашого основного IP у панелі управління), а для SOCKS5 з паролем потрібен локальний тунель або сторонній проксифікатор.

👉 Обрати ротаційні резидентські проксі від $4.00 за ГБ зі sticky-сесіями до 24 годин

Які проксі CyberYozh App обрати для роботи з playwright-mcp

Вибір лінійки залежить від цільового майданчика та тривалості однієї сесії. На платформі CyberYozh App для кожного завдання браузерної автоматизації передбачено свій тип проксі:

  • Мобільні проксі (LTE / 4G / 5G) за ціною від $1.70 на добу з безлімітним трафіком: працюють через фізичні модеми та реальні SIM-картки стільникових операторів. Оскільки на одному мобільному IP оператора за технологією CGNAT одночасно працюють сотні звичайних абонентів, антифрод-системам і пошуковику Google складніше позначити таку адресу як підозрілу, і запити під час багатопотокового парсингу видачі чи перевірки рекламних кабінетів рідше потрапляють під обмеження. Доступні приватні (виділені) та спільні (shared) канали: на приватних ви самі змінюєте IP за посиланням у панелі управління або через API, а на спільних адреса оновлюється за таймером кожні 5 або 30 хвилин. Підтримуються HTTP/HTTPS, SOCKS5, UDP, конфігурації VPN/VLESS і зміна мережевого відбитка ОС (TCP/IP OS fingerprint). Зважайте на особливість стільникових мереж: навіть на приватному каналі вежі оператора періодично оновлюють IP на своєму боці, тому для багатогодинних завдань спершу візьміть тариф на добу й перевірте тривалість сесії.

  • Статичні резидентські ISP-проксі за ціною від $5.29 на місяць з безлімітним трафіком: закріплюють за вами один виділений домашній IP від реального інтернет-провайдера (ISP) на весь термін оренди з аптаймом 99.9% і підтримкою HTTP/HTTPS та SOCKS5. Підходять для тривалих сесій на тижні та місяці: для супроводу клієнтських і брендових проєктів, для регулярної роботи в рекламних кабінетах, панелях управління та інтернет-магазинах, а також для розділення мережевого середовища різних замовників. Під кожного клієнта створюється окрема тека профілю (--user-data-dir), куди один раз прописується виділений статичний ISP-проксі - співробітники відкривають готовий профіль проєкту й одразу виходять в мережу із закріпленого IP, не змішуючи куки різних замовників.

  • Ротаційні резидентські проксі за ціною від $4.00 за ГБ (мінімальний пакет - 3 ГБ; за обсягу 100 ГБ ціна знижується до $2.50 за ГБ): відкривають доступ до пулу з понад 100 млн резидентських IP у 195+ країнах. Містять безкоштовний геотаргетинг (країна, штат/регіон, місто), попереднє фільтрування IP (Advanced IP filtering), аптайм 99.9% і прохідність запитів до 99.99%. Ви можете ввімкнути ротацію на кожен запит або утримувати один IP до 24 годин через sticky-сесії. Невитрачений залишок трафіку автоматично переноситься на наступний розрахунковий місяць, а для команд передбачені масовий генератор доступів (Mass Credentials Generator) і керування через API. Sticky-сесії закривають завдання денного моніторингу цін і покрокової перевірки верстки інтернет-магазинів.

  • Серверні (датацентр) проксі за ціною від $1.77 на місяць: надають виділені та спільні (shared) канали IPv4/IPv6 з безлімітним трафіком на виділених тарифах і аптаймом 99.99%. Підходять для швидких браузерних автотестів сайтів, моніторингу доступності та роботи з відкритими API.

👉 Орендувати мобільні проксі LTE/5G від $1.70 на добу з безлімітним трафіком

Перевірка чистоти IP через чекер Fraud Score і розв'язання частих помилок

Перед запуском сценаріїв playwright-mcp перевірте виділену IP-адресу через вбудовані чекери попередньої оцінки ризиків. Разова перевірка IP коштує $0.15, а єдина підписка за $19.00 на місяць містить 1500 перевірок IP-адрес, 1500 перевірок телефонних номерів і 500 перевірок банківських карток (економія до $600 на місяць). Чекер опитує бази IPQualityScore (IPQS), CyberSource, ThreatMetrix, Stripe Radar, PerimeterX і 118 чорних списків OSINT. Ще до старту браузера ви бачите рядок провайдера (ISP/ASN), оцінку ризику шахрайства та відсутність мітки аномальної активності (Abuse Velocity).

Щоб перевірити зв'язку claude playwright mcp, запустіть термінальний клієнт командою claude. Під час найпершого старту утиліта npx завантажує файли сервера в кеш, тому за довгого відгуку запускайте клієнт зі збільшеним таймаутом: MCP_TIMEOUT=10000 claude. Усередині чату введіть /mcp і переконайтеся, що навпроти playwright світиться статус connected. У першому повідомленні чітко вкажіть назву інструмента, щоб агент сам відкрив браузер, а не згенерував код скрипта у відповідь:

Використовуй Playwright MCP: відкрий сторінку https://app.cyberyozh.com/checkers/, зчитай структуру сторінки та виведи список доступних чекерів для перевірки IP-адрес, номерів і карток.

Якщо ваші браузерні автотести сайтів містять перевірку форм реєстрації за SMS або тестову оплату, у панелі управління CyberYozh App можна орендувати віртуальні номери для приймання SMS і випустити віртуальні картки.

👉 Перевірити репутацію IP і Fraud Score перед запуском браузера

Проблема або помилка в терміналі

Чому виникає

Як виправити

Помилка таймауту під час першого запуску сервера

Під час першого старту утиліта npx завантажує пакет довше за стандартний час очікування

Завантажте пакет заздалегідь командою npx @playwright/mcp@latest --version і запустіть клієнт через MCP_TIMEOUT=10000 claude

Друге вікно Claude Code не може відкрити браузер

Обидва вікна намагаються одночасно зайняти ту саму теку профілю на диску

Додайте прапорець "--isolated" у масив args файлу .mcp.json або вкажіть окрему теку --user-data-dir під кожен проєкт

Claude пише код скрипта замість відкриття браузера

У першому запиті не вказано звернення до MCP-сервера

На початку запиту прямо напишіть: «Використовуй Playwright MCP, щоб відкрити сайт...»

Налаштування проксі з файлу .mcp.json не працюють

Сервер playwright було раніше додано в режимі local, який перекриває файл .mcp.json

Перевірте активний конфіг командою claude mcp get playwright, видаліть дублікат через claude mcp remove playwright і додайте сервер заново

Браузер падає з помилкою на Linux VPS або в Docker

За замовчуванням браузер намагається відкрити графічне вікно на сервері без монітора

Додайте прапорець фонового режиму "--headless" або запустіть сервер на порту (npx @playwright/mcp@latest --headless --port 8931) і підключіть через claude mcp add --transport http playwright http://localhost:8931/mcp

З чого почати роботу з браузерним сервером у Claude Code

Зв'язка playwright-mcp і Claude Code перетворює текстові команди терміналу на точні дії всередині реального браузера: агент відкриває сторінки, знаходить елементи за деревом доступності та збирає дані без збоїв на динамічній верстці. А підключивши мобільні LTE/5G, статичні резидентські ISP або ротаційні резидентські проксі від сервісу CyberYozh App, ви зможете запускати браузерні автотести сайтів, перевіряти регіональні вітрини й парсити каталоги з одного особистого кабінету.

👉 Підключити віртуальні номери для приймання SMS під час тестування форм реєстрації

Поширені запитання про playwright-mcp і Claude Code