Как парсить современные SPA, PWA и динамические сайты на базе искусственного интеллекта

❗ Отказ от ответственности : Это часть 2 из нашей серии из шести частей по продвинутому веб-скрапингу. Хотите начать с самого начала? Догоняйте, прочитав часть 1 !

Если вы занимаетесь веб-скрапингом, вы, вероятно, уже хорошо знакомы с большинством обычных проблем. Но с изменением Сети с невероятной скоростью — особенно благодаря буму ИИ — в игре скрапинга появилось множество новых переменных. Чтобы стать экспертом по веб-скрапингу, вы должны овладеть ими всеми! 🔍

В этом руководстве вы узнаете о передовых методах веб-скрапинга и разберетесь, как сканировать современные сайты — даже с использованием SPA, PWA и ИИ! 💪

Что происходит со SPA, PWA и сайтами на базе искусственного интеллекта?

Раньше веб-сайты представляли собой просто набор статических страниц, управляемых веб-сервером. Перенесемся в настоящее время, и Интернет больше похож на оживленный мегаполис. 🌇

Мы перешли от серверного рендеринга к клиентскому. Почему? Потому что наши мобильные устройства мощнее, чем когда-либо, поэтому передача им части нагрузки имеет смысл. 📲

Конечно, вы, вероятно, уже знаете все это, но чтобы достичь того, где мы находимся сегодня, нам нужно знать, с чего мы начали. Сегодня Интернет представляет собой смесь статических сайтов, динамических серверных сайтов, SPA, PWA, сайтов, управляемых ИИ, и многого другого. 🕸️

И не волнуйтесь — SPA, PWA и AI — это не секретные аббревиатуры государственных учреждений. Давайте разберем этот алфавитный суп. 🥣

SPA: одностраничное приложение

SPA ( Single Page Application ) не означает, что это буквально одна страница, но она обрабатывает навигацию, не перезагружая все каждый раз. Думайте об этом как о Netflix : кликайте и смотрите, как содержимое мгновенно меняется без этой раздражающей перезагрузки страницы. 🍿

Он плавный, быстрый и позволяет вам оставаться в потоке событий.

PWA: прогрессивное веб-приложение

PWA — это как веб-приложения на стероидах. 💊

С технической точки зрения PWA ( Progressive Web App ) использует передовые веб-возможности, чтобы предоставить вам ощущение нативного приложения прямо в вашем браузере.

• Оффлайн функциональность? ✅

• Push-уведомления? ✅

• Почти мгновенная загрузка через кэширование? ✅

  
  

В большинстве случаев вы также можете установить PWA-приложения непосредственно на свое устройство!

Сайты на базе искусственного интеллекта

Сайты на базе искусственного интеллекта привносят капельку магии машинного обучения. От динамически генерируемых дизайнов и чат-ботов до персонализированных рекомендаций — эти сайты создают ощущение, что сайт вас знает . 🤖 ✨

Это не просто просмотр. Это интерактивный опыт, который подстраивается под вас.

А вот и самое интересное

Эти категории? Не являются взаимоисключающими!

Вы можете накладывать их слоями, как парфе. 🍨 PWA также может быть SPA, и оба могут использовать ИИ, чтобы сделать вещи умнее и быстрее. Так что да, там может быть немного дико!

Расширенный сбор данных: навигация в современных веб-джунглях

Короче говоря, рост числа SPA, PWA и сайтов на базе ИИ значительно усложнил Интернет. И да, это означает, что веб-скрапинг стал сложнее, чем когда-либо, с кучей новых факторов, которые нужно учитывать. 😣

А что насчет Web 3.0 ? Пока еще рано говорить о том, какое влияние он окажет на веб-скрапинг, но некоторые эксперты уже высказывают предположения...

Чтобы начать обходить самые распространенные (и раздражающие) препятствия в современном парсинге сайтов, посмотрите это видео от нашего друга Форреста Найта . Глава 3 посвящена именно тому, что вы ищете. 👇

Давайте теперь посмотрим, что следует учитывать при выполнении расширенного веб-скрапинга на современных сайтах!

⚠️ Предупреждение: не расстраивайтесь, если первые несколько советов покажутся вам знакомыми — продолжайте, потому что по мере углубления в тему появится множество новых идей! 🧠

Динамический контент через AJAX и клиентскую визуализацию

В наши дни большинство сайтов либо полностью визуализируются на стороне клиента с помощью JavaScript (то есть визуализируются на стороне клиента ), либо имеют динамические разделы, которые загружают данные или изменяют DOM страницы по мере вашего взаимодействия с ней.

Если вы пользовались браузером в последнее десятилетие, вы знаете, о чем мы говорим. Этот динамический поиск данных — не магия, он работает на технологии AJAX! (И нет, не футбольный клуб Ajax 🔴⚪ — здесь магия иного рода 😉)

Вы, вероятно, уже знаете, что такое AJAX, но если нет, то документы MDN — отличное место для начала . Теперь, имеет ли AJAX большое значение для веб-скрапинга?

С инструментами автоматизации браузера, такими как Playwright, Selenium или Puppeteer , вы можете дать команду своему скрипту загрузить веб-страницу в браузере, включая запросы AJAX. Просто возьмите один из лучших инструментов headless браузера , и все готово!

Для получения дополнительных рекомендаций прочитайте наше полное руководство по парсингу динамических сайтов на Python .

🚨 Но подождите… Есть совет от профессионала! 🚨

Большинство страниц на основе AJAX извлекают динамические данные через вызовы API. Вы можете перехватить эти запросы, открыв вкладку «Сеть» в DevTools вашего браузера при загрузке страницы:

Вы увидите либо:

• Один или несколько REST API для разных конечных точек.

• Один или несколько вызовов API GraphQL к одной конечной точке, которую можно запросить с помощью GraphQL .

  
  

В обоих случаях это открывает дверь для парсинга, напрямую нацеливаясь на эти вызовы API. Просто перехватите и извлеките эти данные — так просто! 🎉

Для краткого ознакомления смотрите видео ниже:

Ленивая загрузка, бесконечная прокрутка и динамическое взаимодействие с пользователем

Веб-страницы стали более интерактивными, чем когда-либо, и дизайнеры постоянно экспериментируют с новыми способами удержания нашей вовлеченности. С другой стороны, некоторые взаимодействия, такие как бесконечная прокрутка , даже стали стандартными. (Вы когда-нибудь ловили себя на том, что бесконечно прокручиваете Netflix? Обязательно посмотрите нужную серию !)

Итак, как нам справиться со всеми этими сложными взаимодействиями при веб-скрапинге? Барабанная дробь... 🥁

С помощью инструментов автоматизации браузера! (Да, снова! 🎉)

Самые современные, такие как Playwright , имеют встроенные методы для обработки общих взаимодействий. А когда появляется что-то уникальное, что они не покрывают? Обычно можно добавить пользовательский код JavaScript, чтобы сделать трюк.

В частности:

• Playwright предлагает метод estimate() для запуска пользовательского JS-кода прямо на странице.

• Selenium предоставляет функцию execute_script() , которая позволяет выполнять JavaScript в браузере.

  
  

Мы знаем, что вы, вероятно, уже имеете дело с этими основами, так что нет нужды углубляться здесь. Но если вы хотите получить полную информацию, посмотрите эти полные руководства:

• Веб-скрапинг драматурга
• Веб-скрапинг Selenium

Кэширование контента в PWA

Вот тут-то все становится пикантнее! 🌶️

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

Итак, как вы справляетесь с кэшированием при скрапинге, особенно при работе с PWA? Ну, большую часть времени вы будете использовать инструмент автоматизации браузера. В конце концов, PWA обычно визуализируются на стороне клиента и/или полагаются на динамическое извлечение данных.

Хорошие новости? Инструменты автоматизации браузера запускают новые сеансы браузера каждый раз, когда вы их запускаете. А в случае Puppeteer и Playwright они даже запускаются в режиме инкогнито по умолчанию. Но вот в чем подвох: сеансы инкогнито/новые не являются кэшированными или не содержат cookie-файлов ! 🤯

Чем больше вы взаимодействуете с сайтом в вашем скрипте скрапинга, тем больше вероятность того, что браузер начнет кэшировать запросы — даже в режиме инкогнито. Чтобы решить эту проблему, вы можете периодически перезапускать headless-браузер.

Или, с помощью Puppeteer, вы можете полностью отключить кэширование с помощью простой команды :

 await page.setCacheEnabled(enabled)

Но что, если сервер за PWA кэширует данные на своем конце? Ну, это совсем другой зверь... 👹

К сожалению, с кэшированием на стороне сервера вы мало что можете сделать. В то же время некоторые серверы обслуживают кэшированные ответы на основе заголовков входящих запросов. Таким образом, вы можете попробовать изменить некоторые заголовки запросов, например User-Agent . 🔄

Откройте для себя лучший User-Agent для веб-скрапинга !

Контекстно-зависимый контент

Вы когда-нибудь задумывались, почему веб-сайты показывают вам контент, который вам почти слишком интересен? Это не магия — это машинное обучение в действии. 💡

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

Полезно ли это? Безусловно — огромная экономия времени! ⏱️

Этично ли это? Ну, вы согласились с этими условиями обслуживания, так что... давайте скажем «да». 🤷

Но вот в чем проблема веб-скрейпинга: в старые времена вы бы беспокоились только о том, что сайты время от времени меняют свою HTML-структуру. Теперь веб-страницы меняются постоянно, потенциально предоставляя другой опыт при каждом посещении.

Итак, как с этим справиться? Чтобы получить стабильные результаты, вы можете запустить инструменты автоматизации браузера с предварительно сохраненными сеансами, которые помогут гарантировать, что контент останется предсказуемым. Такие инструменты, как Playwright, также предоставляют объект BrowserContext для этой цели:

 const browserContext = await browser.newContext({ // load the context storage state from a JSON file storageState: "session.json" }); const page = await context.newPage();

Чтобы избежать персонализированного контента, вам также следует стремиться стандартизировать такие параметры, как язык и IP-адрес, поскольку они также могут влиять на отображаемый контент. 🗺️

И вот последний совет: всегда проверяйте сайты в режиме инкогнито перед тем, как делать парсинг. Таким образом, вы получите сеанс «чистого листа», свободный от персонализированных данных. Это поможет вам лучше понять контент, который обычно доступен на сайте. 🥷

Сайты и веб-страницы, созданные с помощью искусственного интеллекта

А теперь самая горячая тема на данный момент: ИИ ! 🔥

ИИ переписывает правила создания сайтов. То, что раньше занимало месяцы, теперь происходит за секунды или минуты! ⏱️

Краткий обзор того, как технология веб-разработки на основе искусственного интеллекта преобразует игру, можно увидеть в следующем видео:

Результат? Сайты меняют макет, структуру и дизайн быстрее, чем когда-либо. Даже контент получает обработку ИИ, редакторы штампуют огромные объемы текста, изображений и видео в мгновение ока. ⚡

И это только начало…

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

Вся эта случайность — кошмар для традиционных скриптов веб-скрапинга. 😱

Но вот и обратная сторона. Так же, как ИИ ускоряет обновления веб-сайтов, вы можете использовать веб-скрапинг на базе ИИ для адаптации своих скриптов на лету. Хотите узнать больше? Прочитайте руководство по ИИ для веб-скрапинга .

Другое возможное решение, особенно для избежания ошибок, — создание независимых процессов, которые отслеживают изменения на страницах, оповещая вас о том, что ваш скрипт сломается. Например, через сообщение Telegram. 📩

Посмотрите, как создать бота уведомлений Telegram для смены страницы .

Обнаружение ИИ-ботов: мать всех технологий защиты от ботов

Почти каждое из рассмотренных нами решений предполагает, что современные сайты высокоинтерактивны. Это значит, что если вы хотите их скрейпить, вам нужно использовать инструмент автоматизации браузера. Но в этом подходе есть слабое место: сам браузер!

Браузеры не созданы для парсинга! 😲

Конечно, вы можете настроить их с помощью расширений (например, Puppeteer Extra ) или реализовать все упомянутые выше настройки. Но с сегодняшним обнаружением ботов на основе искусственного интеллекта традиционные браузеры все легче обнаружить, особенно когда сайты используют передовые технологии антискрейпинга, такие как анализ поведения пользователя .

Итак, в чем же решение? Мощный браузер для скрапинга, который:

• Работает в режиме Header, как обычный браузер, чтобы не выделяться среди реальных пользователей.

• Легко масштабируется в облаке, экономя ваше время и затраты на инфраструктуру.

• Интегрирует чередующиеся IP-адреса из одной из крупнейших и самых надежных сетей прокси-серверов.

• Автоматически решает CAPTCHA, управляет отпечатками браузера, настраивает файлы cookie и заголовки, одновременно обрабатывая повторные попытки.

• Безупречно работает с ведущими инструментами автоматизации, такими как Playwright, Selenium и Puppeteer.

  
  

Это не просто футуристическая идея. Она здесь, и это именно то, что предлагает Bright Data's Scraping Browser . Хотите более детальный взгляд? Посмотрите это видео:

Заключительные мысли

Теперь вы знаете, какие требования предъявляются к современному веб-скрапингу, особенно когда речь идет о SPA и PWA на базе ИИ!

Вы определенно получили здесь несколько профессиональных советов, но помните, что это всего лишь Часть 2 нашего шестичастного приключения в продвинутом веб-скрапинге! Так что держите ремень безопасности пристегнутым, потому что мы собираемся погрузиться в еще более передовые технологии, умные решения и инсайдерские советы.

Следующая остановка? Секреты оптимизации для более быстрых и умных парсеров! 🚀