Знакомимся с библиотекой Playwright: все, что о ней надо знать

Парсинг данных сегодня эффективно используется в различных направлениях бизнеса. Для Web Scraping активно используются многие инструменты. Сейчас остановимся более подробно на библиотеки Playwright, ее особенностях и возможностях, преимуществах и недостатках, популярных способах применения для сбора данных с интернет-страниц. Выполним краткое сравнение данной библиотеки и аналогов. Остановимся также на том, как обеспечить эффективность, безопасность и анонимность при парсинге данных с использованием мобильных прокси.

Краткое знакомство с библиотекой Playwright

Playwright – библиотека, созданная специально для автоматизации браузера для Node.js. Она призвана обеспечить быстрый, надежный и эффективный парсинг данных с использованием всего нескольких строк года. По своим параметрам она достаточно схожа с библиотеками Selenium и Puppeteer. Пользователи оценили простоту и удобство в работе, передовые возможности для автоматизации сбора данных, а также их интеллектуального анализа. Одна из отличительных особенностей данной библиотеки – поддержка так называемых безголовых браузеров. Также к преимуществам Playwright относят кроссбраузерную поддержку.

Знакомство с новой библиотекой начнем с пары слов о Headless-браузерах, ведь они сегодня активно используются при веб-скрапинге. Среди их отличительных особенностей стоит выделить:

• отсутствие графического пользовательского интерфейса;
• минимальные требования к ресурсам, быстрый и простой запуск на сервере;
• возможно создание большого количества экземпляров такого браузера одновременно, что обеспечит эффективный парсинг данных сразу с нескольких интернет страничек.

Сегодня все больше сайтов создается на основании фреймворков одностраничных приложений – SPA, в частности React.js, Angular, Vue.js и пр. Если на такие сайты заходить при помощи классических HTTP-клиентов, то в итоге вы получите пустую HTML-страницу, ведь она построена на основании внешнего кода Javascript. Безголовые браузеры призваны решить эту проблему и организовать эффективный скрапинг веб сайтов. Более подробно о том, как устроен и работает Headless-браузер можно познакомиться здесь.

Начинаем работу с библиотекой Playwright

Прежде, чем переходить непосредственно к работе с библиотекой Playwright необходимо ознакомиться с ее руководством. Далее пробуем написать собственный парсер для сбора определенных данных при помощи данной библиотеки. В качестве примера рассмотрим вариант сбора финансовых показателей. Для этого необходимо последовательно выполнить ряд действий:

1. Создаем новый Node.js проект и устанавливаем в нем библиотеку Playwright. Для этого достаточно будет выполнить всего 2 команды: «nmp init –yes» и «npm i playwright».
2. Формируем index.js файл и прописываем первые строки кода. На примере можно увидеть экземпляр Headless-браузера. Хотим обратить ваше внимание на то, что мы использовали в строке 4 значения false. Благодаря этому при запуске кода отобразится всплывающий интерфейс пользователя. В том случае, если вы решите заменить false на true, то библиотека Playwright будет работать в автономном режиме. Следуя нашей инструкции, создаем новую страничку в браузере, а затем переходим на Yahoo. Буквально 5 секунд и закрываем браузер:
   
3. Заходим в Yahoo со своего браузера. Первым делом проверяем домашнюю страничку на наличие на Yahoo.Финанс. В качестве примера рассмотрим вариант создания финансового приложения, для которого вам требуется наличие достаточного количества данных с фондовых рынков. Непосредственно с домашней странички Yahoo мы видим, что в заголовке появились сводные рыночные данные. Теперь нам необходимо проверить узел DOM и элемент заголовка в инспекторе браузера. Как это сделать видно на картинке:
   
4. Если вы обратили внимание, то заголовок имеет расширение id=YDC-Lead-Stack-Composite. Вы можете напрямую ориентироваться на данный идентификатор, чтобы извлечь из него необходимые данные. Для реализации этой задумки необходимо вставить следующие строки прямо в код:
   
5. Обратите внимание на функцию $eval. Она требует задания двух параметров, в частности идентификатора селектора и анонимной функции. В сценарии, который мы рассматриваем передается идентификатор узла, который мы и планируем извлечь. Используя анонимную функцию, можно запустить любой клиентский код из тех, что доступны для применения в браузере:
   
6. В примере мы рассматриваем простой клиентский JS-код, способный захватывать элементы li в узле заголовка. Данный код способен вывести в терминал следующее данные:
   

Все. На этом сбор первых данных успешно завершен. Но на этом работа с библиотекой Playwright не заканчивается. Сейчас перейдем к тому, как извлечь с ее помощью списки элементов, картинки, сделать скриншоты.

Извлекаем список элементов из таблицы при помощи Playwright

Теперь на примере рассмотрим, как извлечь список элементов из таблицы. Продолжаем нашу финансовую тематику и ставим перед собой задачу получить наиболее популярные акции с данной странички.

В данном случае нас интересует идентификатор в атрибуте fin-scr-res-table. При желании также можно развернуть поиск в узле DOM до элемента таблицы. На картинке приведен пример решения данной задачи:

Хотим обратить ваше внимание что здесь page.$eval работает как querySelector клиентского JavaScript. В случае, если перед вами стоит задача по извлечению тегов определенного типа, то необходимо задействовать функцию page.$$(selector). Благодаря этому вы сможете вернуть все элементы, соответствующие конкретному селектору на выбранной вами странице:

Извлекаем изображения при помощи Playwright

Для извлечения изображений изначально нам необходимо сосредоточиться на узле DOM, предназначенном для захвата картинок. Чтобы достичь желаемого результата нам потребуется функция src. Формируем HTTP GET-запрос к источнику и подгружаем изображение. На картинке видно, как это реализовать на практике.

То есть, изначально обращаем внимание на тот узел DOM, который нам интересен, а затем в строке 11 указываем атрибут src непосредственно из тега картинки. Затем формируем GET-запрос с использованием axios, а уже затем сохраняем изображение.

Формируем скриншоты при помощи Playwright

Еще одна функциональная возможность библиотеки Playwright – формирование скриншотов страницы. На сервисе реализован метод page.screenshot, при помощи которого вы сможете сделать любое количество снимков экрана интернет-странички.

Если требуется ограничить снимок только частью экрана, то требуется задать координаты окна просмотра. Реализовать на практике это можно следующим образом:

Хотим обратить ваше внимание, что точкой отсчета для координат X и Y будет верхний левый угол экрана.

Как сформировать запросы с использованием селекторов выражении XPath

Запрос элементов DOM с использованием выражений XPath – это достаточно мощная, но вместе с тем простая функция библиотеки Playwright. Под XPath подразумевается особый шаблон, предназначенный для формирования набора узлов в DOM.

В качестве примера возьмем один из блогов и попробуем получить из него все навигационные ссылки. Здесь мы будем извлекать элемент nav в DOM. Воспользуйтесь следующей иерархией html > body > div > header > nav, чтобы найти в дереве интересующей нас элемент навигации:

После этого формируем XPath выражение:

На картинке вы видите сценарий, который XPath будет использовать для извлечения nav элементов в DOM.

Отправляем формы и извлекаем аутентифицированные маршруты

Данный пример актуален для случаев, когда перед вами стоит задача парсинга данных с интернет-страничек, защищенных аутентификацией. Playwright позволит быстро и просто отправить соответствующую форму. Как это сделать приведено на картинке:

Более того, библиотека Playwright позволяет легко формировать fill события и моделировать clicks. Результат выполнения данного сценария приведем на картинке:

Краткое сравнение библиотеки Playwright с Selenium и Puppeteer

Наряду с Playwright существует ряд других библиотек для парсинга данных. Наиболее популярные на сегодня решения – это Selenium и Puppeteer. И первое, что выгодно отличает Playwright от аналогов – повышенное удобство в работе для специалистов. Не зря данная библиотека сегодня пользуется стабильно высоким спросом среди программистов. Вот ряд основных моментов, на которые мы бы хотели обратить ваше внимание:

1. Документация. Отличное сопроводительная документация присутствует в библиотеках Playwright и Puppeteer. В Selenium она тоже есть, но доработки были бы не лишними.
2. Производительность. Если запустить один и тот же скрипт в каждой из библиотек, то медленнее всего будет работать Selenium. Если же провести специальные тесты по производительности, то большая часть из них будет иметь лучшие результаты в Playwright, чем в Puppeteer.
3. Сообщество. В Playwright на сегодня присутствует небольшое, но достаточно активное сообщество, что позволяет быстро находить профессиональные решения для возникшей проблемы. Как в Puppeteer, так и в Selenium присутствует достаточно большое сообщество с активными проектами.

По мнению специалистов, работающих с данными библиотеками, наивысших оценок заслужили Playwright и Puppeteer. Selenium оценивается как достаточно хороший сервис. Все это позволяет сделать выводы, что Playwright – это достаточно мощный, автономный инструмент, который находится на этапе активного развития. Данная библиотека станет отличным вариантом для парсинга интернет-страничек, особенно для тех, у кого уже есть определенный опыт работы с Node.js.

А как же быть с безопасностью работы в интернете?

В любом случае, вне зависимости от того с какой библиотекой вы планируете работать, парсинг страниц – это многопоточные действия, которые могут вызвать негативную реакцию со стороны поисковых систем при выполнении множественных запросов с одного и того же IP-адреса. Антифрод-системы будут просто блокировать ваш доступ. Чтобы избежать подобного рекомендуем дополнительно подключить к работе мобильные прокси, в частности от сервиса MobileProxy.Space. В этом случае вы получаете:

• высокую скорость взаимодействия с интернетом, что обеспечивается использованием технических возможностей операторов сотовых сетей и кэшированием данных;
• абсолютную конфиденциальность и безопасность работы в интернете, защиту от любого несанкционированного доступа;
• эффективное обхождение региональных блокировок и получение доступа к сайтам из любой страны мира;
• стабильность работы в многопоточном режиме, в том числе с применением автоматизированного программного обеспечения.

Чтобы более подробно познакомиться с функциями и возможностями мобильных прокси от MobileProxy.Space, рекомендуем пройти по ссылке https://mobileproxy.space/user.html?buyproxy. Среди основных моментов хотелось бы выделить предоставление каждому пользователю персонального канала с неограниченным трафиком, возможностью настройки автоматической или принудительной смены IP-адресов, одновременную работу по протоколам HTTP(S) и Socks5. Также предусмотрен большой выбор геолокаций и операторов сотовых сетей под них, которые можно будет менять непосредственно в рабочем процессе. Еще сервис предлагает круглосуточную техническую поддержку, что позволяет быстро и профессионально решать возникшие проблемы.

Поделитесь статьёй: