paint-brush
Como raspar SPAs modernos, PWAs e sites dinâmicos baseados em IApor@brightdata
Novo histórico

Como raspar SPAs modernos, PWAs e sites dinâmicos baseados em IA

por Bright Data9m2024/11/14
Read on Terminal Reader
Read this story w/o Javascript

Muito longo; Para ler

Este guia, Parte 2 de uma série sobre web scraping avançado, mergulha nas complexidades do scraping de sites modernos e dinâmicos. À medida que a web evolui com Single-Page Applications (SPAs), Progressive Web Apps (PWAs) e sites orientados por IA, o scraping tradicional enfrenta novos desafios. O guia explica a navegação perfeita dos SPAs, os recursos semelhantes a aplicativos dos PWAs e como a IA personaliza o conteúdo, criando obstáculos como renderização do lado do cliente, AJAX e cache. As técnicas de scraping incluem ferramentas de automação do navegador (por exemplo, Playwright) e estratégias para contornar a detecção de bots, gerenciar dados dinâmicos e lidar com conteúdo personalizado. O guia apresenta dicas futuras sobre como otimizar ferramentas de scraping para melhor velocidade e confiabilidade.

People Mentioned

Mention Thumbnail

Companies Mentioned

Mention Thumbnail
Mention Thumbnail

Coin Mentioned

Mention Thumbnail
featured image - Como raspar SPAs modernos, PWAs e sites dinâmicos baseados em IA
Bright Data HackerNoon profile picture
0-item

Aviso Legal : Esta é a Parte 2 da nossa série de seis partes sobre Advanced Web Scraping. Quer começar do começo? Recupere-se lendo a Parte 1 !


Se você gosta de web scraping, provavelmente já está familiarizado com a maioria dos desafios usuais. Mas com a Web mudando em velocidade de dobra — especialmente graças ao boom da IA — há toneladas de novas variáveis no jogo de scraping. Para subir de nível como um especialista em web scraping, você deve dominá-las todas! 🔍


Neste guia, você descobrirá técnicas avançadas de web scraping e decifrará o código sobre como fazer scraping nos sites modernos de hoje, mesmo com SPAs, PWAs e IA na mistura! 💪

Qual é o problema com SPAs, PWAs e sites com tecnologia de IA?

Antigamente, os sites eram apenas um monte de páginas estáticas gerenciadas por um servidor web. Avançando para agora, a Web é mais como uma metrópole movimentada. 🌇


Nós pulamos da renderização do lado do servidor para a do lado do cliente. Por quê? Porque nossos dispositivos móveis estão mais poderosos do que nunca, então deixá-los lidar com parte da carga faz todo o sentido. 📲


Claro, você provavelmente já sabe de tudo isso — mas para chegar onde estamos hoje, precisamos saber onde começamos. Hoje, a Internet é uma mistura de sites estáticos, sites dinâmicos renderizados por servidores, SPAs, PWAs, sites orientados por IA e muito mais. 🕸️


E não se preocupe — SPA, PWA e AI não são siglas secretas para agências governamentais. Vamos decompor essa sopa de letrinhas. 🥣

SPA: Aplicação de página única

SPA ( Single Page Application ) não significa que é literalmente uma página, mas lida com a navegação sem recarregar tudo a cada vez. Pense nisso como Netflix : clique e assista ao conteúdo mudar instantaneamente sem aquele irritante recarregamento de página. 🍿


Fry não é o único que tem dúvidas sobre a atualização de páginas ao usar SPAs


É suave, rápido e permite que você permaneça no fluxo.

PWA: Aplicativo Web Progressivo

Os PWAs são como aplicativos da web com esteroides. 💊


Tecnicamente falando, um PWA ( Progressive Web App ) usa recursos de ponta da web para dar a você a sensação de um aplicativo nativo diretamente do seu navegador.

  • Funcionalidade offline? ✅

  • Notificações push? ✅

  • Carregamento quase instantâneo por meio de cache? ✅


Na maioria dos casos, você também pode instalar PWAs diretamente no seu dispositivo!

Sites com tecnologia de IA

Sites com tecnologia de IA trazem uma pitada de mágica de aprendizado de máquina. De designs e chatbots gerados dinamicamente a recomendações personalizadas, esses sites fazem você sentir como se o site o conhecesse . 🤖 ✨


Não é apenas navegar. É uma experiência interativa que se adapta a você.

Aqui está a parte divertida

Essas categorias? Não são mutuamente exclusivas!


Web → SPA → PWA → IA


Você pode colocá-los em camadas como um parfait. 🍨 Um PWA também pode ser um SPA, e ambos podem alavancar a IA para tornar as coisas mais inteligentes e rápidas. Então, sim, pode ficar um pouco selvagem lá fora!

Raspagem avançada de dados: navegando na selva da web de hoje

Resumindo, a ascensão de SPAs, PWAs e sites com tecnologia de IA tornou a web muito mais complexa. E, sim, isso significa que a raspagem da web é mais desafiadora do que nunca, com uma tonelada de novos fatores a serem considerados. 😣


E o que dizer da Web 3.0 ? Bem, é um pouco cedo para dizer o impacto que ela terá no web scraping, mas alguns especialistas já estão especulando…


Para começar a contornar os obstáculos mais comuns (e irritantes) de hoje em dia na raspagem de sites moderna, dê uma olhada neste vídeo do nosso amigo Forrest Knight . O Capítulo 3 cobre exatamente o que você está procurando. 👇


Vamos agora ver o que você precisa considerar ao realizar web scraping avançado em sites modernos!


⚠️ Aviso: Não desanime se as primeiras dicas parecerem familiares — continue, porque há muitos insights novos à medida que nos aprofundamos! 🧠

Conteúdo dinâmico via AJAX e renderização do lado do cliente

Hoje em dia, a maioria dos sites é totalmente renderizada no lado do cliente via JavaScript (que é a renderização do lado do cliente ) ou tem seções dinâmicas que carregam dados ou alteram o DOM da página conforme você interage com ela.


Se você usou um navegador na última década, sabe do que estamos falando. Essa recuperação dinâmica de dados não é mágica — é alimentada pela tecnologia AJAX! (E não, não é o clube de futebol Ajax 🔴⚪ — um tipo diferente de mágica aqui 😉)


Você provavelmente já sabe o que é AJAX, mas se não, os documentos do MDN são um ótimo lugar para começar . Agora, AJAX é um grande negócio para web scraping?


Na verdade…


Com ferramentas de automação de navegador como Playwright, Selenium ou Puppeteer , você pode comandar seu script para carregar uma página da web em um navegador, incluindo solicitações AJAX. Basta pegar uma das melhores ferramentas de navegador headless e pronto!


Para obter mais orientações, leia nosso tutorial completo sobre como extrair dados de sites dinâmicos em Python .


🚨 Mas, espere… Tem uma dica profissional! 🚨


A maioria das páginas baseadas em AJAX extraem dados dinâmicos por meio de chamadas de API. Você pode capturar essas solicitações abrindo a aba Network no DevTools do seu navegador ao carregar uma página:


Observe o “Fetch/XHR” para filtrar solicitações AJAX


Você verá:

  • Uma ou mais APIs REST para diferentes endpoints.

  • Uma ou mais chamadas de API GraphQL para um único endpoint, que você pode consultar usando GraphQL .


Em ambos os casos, isso abre a porta para scraping ao direcionar essas chamadas de API diretamente. Basta interceptar e puxar esses dados — fácil assim! 🎉

Veja o vídeo abaixo para um rápido passo a passo:

Carregamento lento, rolagem infinita e interação dinâmica do usuário

As páginas da web estão mais interativas do que nunca, com designers constantemente experimentando novas maneiras de nos manter engajados. Por outro lado, algumas interações, como rolagem infinita , até se tornaram padrão. (Já se viu rolando infinitamente pela Netflix? Certifique-se de conferir a série certa !)


Hora de aprender coisas novas! Pare de perder seu tempo rolando para baixo


Então, como lidamos com todas essas interações complicadas na web scraping? Rufem os tambores... 🥁


Com ferramentas de automação do navegador! (Sim, de novo! 🎉)


Notícias velhas são boas notícias


Os mais modernos, como o Playwright , têm métodos incorporados para lidar com interações comuns. E quando algo único aparece que eles não cobrem? Normalmente, você pode adicionar código JavaScript personalizado para fazer o truque.


Em particular:

  • O Playwright oferece o método assess() para executar JS personalizado diretamente na página.

  • O Selenium fornece execute_script() , que permite executar JavaScript no navegador.


Sabemos que você provavelmente já tem uma noção desses conceitos básicos, então não precisa se aprofundar aqui. Mas se quiser saber tudo, veja estes guias completos:

Cache de conteúdo em PWAs

É aqui que as coisas ficam picantes! 🌶️


Os PWAs são criados para funcionar offline e dependem muito de cache . Embora isso seja ótimo para usuários finais, cria uma dor de cabeça para web scraping porque você quer recuperar dados novos.


Lidar com dados em cache é complicado…


Então, como você lida com o cache ao fazer scraping — especialmente ao lidar com um PWA? Bem, na maioria das vezes, você usará uma ferramenta de automação de navegador. Afinal, os PWAs são tipicamente renderizados do lado do cliente e/ou dependem de recuperação dinâmica de dados.


As boas notícias? Ferramentas de automação de navegador iniciam novas sessões de navegador toda vez que você as executa. E no caso do Puppeteer e do Playwright, elas até iniciam no modo anônimo por padrão. Mas aqui está o problema: sessões anônimas/novas não são livres de cache ou cookies ! 🤯

Quanto mais você interage com um site no seu script de scraping, mais provável é que o navegador comece a armazenar em cache as solicitações — mesmo no modo anônimo. Para resolver o problema, você pode reiniciar o navegador headless periodicamente.


Ou, com o Puppeteer, você pode desabilitar o cache completamente com um comando simples :


 await page.setCacheEnabled(enabled)


Mas e se o servidor por trás do PWA estiver armazenando dados em cache em seu final? Bem, isso é outra fera… 👹


Infelizmente, não há muito que você possa fazer sobre o cache do lado do servidor. Ao mesmo tempo, alguns servidores servem respostas em cache com base nos cabeçalhos em solicitações recebidas. Assim, você pode tentar alterar alguns cabeçalhos de solicitação, como o User-Agent . 🔄


Descubra o melhor User-Agent para web scraping !

Conteúdo específico do contexto

Já se perguntou por que os sites parecem mostrar conteúdo que você está quase interessado demais ? Não é mágica — é aprendizado de máquina em ação. 💡

Hoje em dia, mais e mais páginas da web servem conteúdo personalizado adaptado às suas preferências. Com base em suas pesquisas, interações no site, compras, visualizações e outros comportamentos online, os algoritmos de ML entendem o que você gosta e as páginas da web servem conteúdo de acordo .


É útil? Com certeza — uma grande economia de tempo! ⏱️


É ético? Bem, você concordou com esses termos de serviço, então... vamos com sim. 🤷


Mas aqui está o desafio para web scraping: antigamente, você só se preocupava com sites mudando sua estrutura HTML ocasionalmente. Agora, as páginas da web mudam continuamente, potencialmente entregando uma experiência diferente a cada vez que você as visita.


Ouça o Mestre Yoda


Então, como você lida com isso? Para obter resultados consistentes, você pode iniciar suas ferramentas de automação de navegador com sessões pré-armazenadas, que ajudam a garantir que o conteúdo permaneça previsível. Ferramentas como Playwright fornecem um objeto BrowserContext também para esse propósito:


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


Para evitar conteúdo personalizado, você também deve tentar padronizar parâmetros como idioma e localização de IP, pois eles também podem influenciar o conteúdo exibido. 🗺️


E aqui vai uma dica final: sempre inspecione os sites no modo anônimo antes de fazer scraping. Dessa forma, você tem uma sessão de “folha em branco”, livre de dados personalizados. Isso ajuda você a entender melhor o conteúdo normalmente disponível no site. 🥷

Sites e páginas da Web gerados por IA

Agora, o assunto do momento: IA ! 🔥


A IA está reescrevendo o manual sobre como construímos sites. O que costumava levar meses, agora está acontecendo em segundos ou minutos! ⏱️


Para uma rápida visão geral de como a tecnologia de construção de sites baseada em IA está transformando o jogo, assista ao vídeo a seguir:


O resultado? Os sites estão mudando o layout, a estrutura e o design mais rápido do que nunca. Até mesmo o conteúdo está recebendo o tratamento de IA, com editores produzindo enormes quantidades de texto, imagens e vídeos em um piscar de olhos. ⚡


E isso é só o começo…


O que?!?


Imagine um futuro onde os sites podem gerar páginas dinamicamente com base no que você clica ou pesquisa. É como se elas estivessem se transformando em tempo real, adaptando-se a cada usuário.


Toda essa aleatoriedade é um pesadelo para scripts tradicionais de web scraping. 😱


Mas aqui está o outro lado. Assim como a IA acelera as atualizações de sites, você pode usar web scraping com tecnologia de IA para adaptar seus scripts rapidamente. Quer se aprofundar mais? Leia um guia sobre IA para web scraping .


Outra solução possível, especialmente para evitar erros, é criar processos independentes que monitorem as páginas em busca de alterações, alertando você antes que seu script quebre. Por exemplo, por meio de uma mensagem do Telegram. 📩


Veja como criar um bot de notificação de mudança de página no Telegram .

Detecção de bots por IA: a mãe de todas as tecnologias de proteção contra bots

Quase todas as soluções que cobrimos até agora pressupõem que os sites modernos são altamente interativos. Isso significa que se você quiser raspá-los, você deve usar uma ferramenta de automação do navegador. Mas há um ponto fraco nessa abordagem: o próprio navegador!


Os navegadores não foram feitos para scraping! 😲


Claro, você pode ajustá-los com extensões (como com Puppeteer Extra ) ou implementar todos os ajustes mencionados acima. Mas com a detecção de bots orientada por IA de hoje, os navegadores tradicionais são cada vez mais fáceis de detectar, especialmente quando os sites adotam tecnologia anti-scraping avançada, como análise de comportamento do usuário .


Então, qual é a solução? Um poderoso navegador de scraping que:

  • Funciona no modo orientado como um navegador comum para se misturar aos usuários reais.

  • Escala facilmente na nuvem, economizando tempo e custos de infraestrutura.

  • Integra IPs rotativos de uma das maiores e mais confiáveis redes de proxy.

  • Resolve CAPTCHAs automaticamente, gerencia a impressão digital do navegador e personaliza cookies e cabeçalhos, tudo isso enquanto processa as tentativas para você.

  • Funciona perfeitamente com as principais ferramentas de automação, como Playwright, Selenium e Puppeteer.


Esta não é apenas uma ideia futurística. Ela está aqui, e é exatamente o que o Scraping Browser da Bright Data oferece. Quer uma visão mais aprofundada? Veja este vídeo:


Considerações finais

Agora você sabe o que a raspagem da web moderna exige, especialmente quando se trata de enfrentar SPAs e PWAs controlados por IA!


Você definitivamente pegou algumas dicas profissionais aqui, mas lembre-se, esta é apenas a Parte 2 da nossa aventura de seis partes em web scraping avançado! Então, mantenha o cinto de segurança apertado porque estamos prestes a mergulhar em ainda mais tecnologia de ponta, soluções inteligentes e dicas privilegiadas.


Próxima parada? Segredos de otimização para scrapers mais rápidos e inteligentes! 🚀