Extrair dados da web moderna muitas vezes pode parecer um jogo de esconde-esconde. Embora há uma década a maior parte das informações estivesse prontamente disponível em HTML, hoje em dia os desenvolvedores adoram ocultar e ofuscar dados, renderizando-os dinamicamente com JavaScript.
Isto representa um desafio interessante para os raspadores. Embora não possamos mais contar com a análise do conteúdo HTML bruto, uma infinidade de dados ainda está presente na página – só precisamos saber onde procurar.
Neste guia abrangente, exploraremos vários métodos, ferramentas e técnicas que podem ser usadas para extrair dados ocultos da web.
O que são dados ocultos da Web?
Dados ocultos da web referem-se a quaisquer dados que não sejam diretamente visíveis na fonte HTML bruta da página. Isso inclui:
Dados carregados dinamicamente via JavaScript após o carregamento da página. Por exemplo, renderizar o conteúdo de um
<div>tag inserindo elementos HTML criados dinamicamente.Dados armazenados em variáveis JavaScript e objetos incorporados em
<script>Tag. Freqüentemente, objetos JSON contendo conjuntos de dados inteiros.Conteúdo HTML gerado na ação do usuário por meio de solicitações AJAX. Por exemplo, expansão de tópicos de comentários ou paginação de rolagem infinita.
Dados e metadados de solicitação de API interna usados pelo frontend para funcionar. Por exemplo, tokens CSRF, informações do usuário, caches temporários.
Dados ofuscados e criptografados com o objetivo de impedir que scrapers os acessem.
O tema comum é que esses dados não estão disponíveis no HTML original retornado do servidor, mas sim gerados posteriormente pelo JavaScript em execução na página.
Sites dinâmicos modernos dependem muito dessa técnica para construir experiências de front-end rápidas. Todos os dados podem ser ocultados e renderizados normalmente em pequenos pedaços, conforme necessário.
Infelizmente, isso significa que os scrapers terão que trabalhar um pouco mais para obter esses dados. Vejamos algumas maneiras de fazer isso de forma eficiente.
Encontrando dados ocultos em HTML
O primeiro passo é confirmar se os dados que queremos estão realmente ocultos em algum lugar do JavaScript da página.
Aqui está um método simples para verificar:
Carregue a página de destino no navegador e localize um identificador de dados exclusivo que queremos extrair. Por exemplo, um nome ou ID de produto.
Desative o JavaScript no navegador e recarregue a página. Isso pode ser feito nas ferramentas do desenvolvedor.
Verifique se o identificador exclusivo ainda está presente no código-fonte HTML bruto.
Se os dados desaparecerem, provavelmente serão renderizados dinamicamente por JavaScript no carregamento da página.
Agora temos que vasculhar o código-fonte HTML para descobrir onde e como ele está gerando esse conteúdo.
Extraindo dados de tags
Um dos locais mais comuns para a permanência de dados ocultos é dentro <script> Tag.
Podem ser objetos JSON, variáveis JavaScript, conjuntos de dados inteiros ou código que manipula a página.
Por exemplo:
<html>
<body>
<div id="product"></div>
<script>
// product data as javascript object
var data = {
"product": {
"name": "Super Product",
"price": 99.99
}
}
// data rendered on page load
document.getElementById("product").innerHTML = data.product.name + ": £" + data.product.price;
</script>
</body>
</html>Aqui, os dados reais do produto são armazenados em uma variável de objeto JavaScript chamada data.
O produto <div> está vazio para começar e preenchido dinamicamente no carregamento da página.
Então, para extrair esses dados, primeiro temos que encontrar o relevante <script> tag no HTML bruto. Isso pode ser feito com qualquer biblioteca de análise HTML como BeautifulSoup ou Parsel:
# extract scripts from HTML with BeautifulSoup
from bs4 import BeautifulSoup
html = # page HTML
soup = BeautifulSoup(html, ‘html.parser‘)
scripts = soup.find_all(‘script‘)Em seguida, temos que extrair especificamente os dados do conteúdo do script.
Método 1: carregar como JSON
Se os dados forem um objeto JSON válido, podemos simplesmente carregá-los diretamente com o Python json módulo:
import json
# find script with data variable
script = soup.find(‘script‘, text=lambda t: ‘data =‘ in t)
# load json directly
data = json.loads(script.string)
print(data[‘product‘])
# {‘name‘: ‘Super Product‘, ‘price‘: 99.99}Isso funciona muito bem se a tag do script especificar type="application/json".
Método 2: correspondência de Regex
Para dados mais complexos, teremos que analisar nós mesmos o código JavaScript bruto. É aqui que as expressões regulares são úteis.
Podemos escanear o código e extrair partes que correspondam a um padrão – como nosso objeto de dados.
import re
import json
script = soup.find(‘script‘, text=lambda t: ‘data =‘ in t)
# match the data object by surrounding syntax
match = re.search(r‘data = ({.+})‘, script.string)
# load matched json
data = json.loads(match.group(1))
print(data[‘product‘])
# {‘name‘: ‘Super Product‘, ‘price‘: 99.99}A chave é criar cuidadosamente um padrão regex que identifique exclusivamente o conjunto de dados que desejamos do restante do código.
Método 3: análise de JavaScript
Para raspagem avançada, podemos querer analisar o código JavaScript completo – incluindo variáveis, funções e objetos.
Isso permite extrair quaisquer dados enquanto mantém a estrutura e o contexto originais.
Podemos usar bibliotecas como PyJavascript e Js2Py para interpretar JavaScript em Python.
Por exemplo com PyJavascript:
import javascript
script = soup.find(‘script‘, text=lambda t: ‘data =‘ in t)
# init JavaScript interpreter
js = javascript.Interpreter()
# run script to define data variable
js.execute(script.string)
# access parsed data object
print(js.context[‘data‘][‘product‘])
# {‘name‘: ‘Super Product‘, ‘price‘: 99.99} Isso nos permite explorar todo o ambiente JavaScript, além dos conjuntos de dados que desejamos.
Extraindo dados de API de JavaScript
As APIs potencializam a maior parte do comportamento dinâmico em sites modernos. JavaScript faz solicitações para carregar dados, enviar formulários ou acionar interações.
Ao nos aprofundarmos no código da página, podemos encontrar esses endpoints da API e imitar as solicitações para extrair dados.
Por exemplo, aqui está um script simples que carrega dados do produto de um /api/products/123 ponto final:
async function loadProduct(){
let response = await fetch(‘/api/products/123‘);
let product = await response.json();
// render product data to page
document.getElementById("product").innerHTML = product.name;
}
loadProduct();Depois de localizar esse script no HTML, podemos:
Extraia o URL da API do
fetch()chamadaAnalise os formatos de solicitação e resposta AJAX
Replique a solicitação de API diretamente em Python com bibliotecas como Requests
Isso permite extrair dados de APIs das quais o JavaScript depende, sem executar nenhum código do navegador.
Encontrando dados em variáveis JavaScript
Os dados da página também são comumente armazenados diretamente em variáveis JavaScript.
Por exemplo:
// javascript data
var products = [
{name: "Product 1", price: 19.99},
{name: "Product 2", price: 24.99}
];
function renderProducts(){
// loop through products and render HTML
} Aqui a lista completa de produtos é armazenada em uma variável chamada products.
Para extrair isso, primeiro precisamos encontrar o nome da variável que corresponde à nossa estrutura de dados de destino. Podemos usar uma abordagem regex semelhante:
import re
import json
# find products variable
script = soup.find(‘script‘, text=lambda t: ‘var products =‘ in t)
# match products json
match = re.search(r‘var products = ({.+});‘, script.string)
data = json.loads(match.group(1))
print(data)
# [{name: "Product 1", price: 19.99}, {name: "Product 2", price: 24.99}]Se a estrutura de dados for mais complexa, podemos analisar todo o ambiente JavaScript para acessar quaisquer variáveis no escopo.
Raspando conteúdo carregado via AJAX
Os sites frequentemente carregam conteúdo dinamicamente via AJAX após o carregamento da página.
Por exemplo, expansão de tópicos de comentários, paginação de rolagem infinita ou guias.
Este conteúdo não está presente no HTML inicial, mas é solicitado ao servidor conforme necessário.
Podemos raspar esses trechos AJAX:
Monitoramento de solicitações de rede na página para identificar URLs AJAX.
Reconstruindo solicitações AJAX e enviando-as diretamente do código Python.
Analisando as respostas AJAX que contêm dados HTML/JSON.
Por exemplo, considere este script que carrega dados paginados na rolagem:
// initially loaded page data
var results = [ /* initial page of data */];
// paginate on scroll
window.addEventListener(‘scroll‘, function() {
var page = results.length / 20 + 1;
// request next page
fetch(‘/data?page=‘ + page)
.then(res => res.json())
.then(data => {
results.push(...data);
// render new data
});
});Aqui podemos ver que ele está solicitando páginas de /data endpoint e anexando conteúdo a results variável.
Podemos replicar essas solicitações e extrair os dados diretamente, evitando ter que analisar o HTML totalmente renderizado.
Executando JavaScript com navegadores sem cabeça
Para obter o máximo em extração de conteúdo dinâmico, podemos ativar um navegador totalmente headless, carregar a página e acessar diretamente o ambiente JavaScript.
Isso permite avaliar o código, carregar conteúdo dinâmico e acessar quaisquer dados, funções ou elementos DOM disponíveis para a página ativa.
Aqui está um exemplo com Playwright em Python:
from playwright.sync_api import sync_playwright
with sync_playwright() as p:
browser = p.chromium.launch()
page = browser.new_page()
page.goto(‘https://targetpage.com‘)
# evaluate browser context to get data
data = page.evaluate(‘window.products‘)
browser.close()
print(data)A chave é usar page.evaluate() para executar código JavaScript personalizado no contexto da página carregada.
Isso nos dá acesso completo para extrair quaisquer dados ocultos.
A desvantagem é ter que iniciar uma instância completa do navegador – o que é mais lento que as solicitações HTTP diretas. Portanto, este método deve ser usado com moderação para páginas complexas.
Dados ofuscados e criptografados
Os sites muitas vezes ofuscam deliberadamente seu JavaScript para evitar scraping.
Alguns exemplos incluem:
Minimizando nomes de variáveis e funções para caracteres sem sentido como
a,b,fn1()Dividindo conjuntos de dados em múltiplas variáveis e scripts
Criptografar/codificar dados para que não sejam legíveis por humanos
Montagem dinâmica de dados em tempo de execução a partir de partes fragmentadas
Técnicas de proteção de código, como empacotamento, ofuscação, antidepuração e execução de VM
Isso pode tornar a análise do JavaScript muito complicada. Pequenas alterações no código podem facilmente quebrar nossos scrapers.
Existem algumas maneiras de lidar com páginas muito ofuscadas:
Use navegadores headless como Playwright ou Puppeteer para carregar o código executado em vez de analisar diretamente a fonte ofuscada.
Rastreie a execução do código para entender como os dados são montados – por exemplo, usando ferramentas de desenvolvedor de navegador ou proxy do tráfego do navegador.
Analise como os usuários reais interagem com a página para identificar fontes de dados.
Os padrões correspondem a estruturas de dados conhecidas – como nomes de produtos, preços, IDs – para localizar partes de código relevantes, mesmo que as variáveis estejam ofuscadas.
Para criptografia, tente localizar chaves de criptografia ou algoritmos de descriptografia de engenharia reversa.
Com o tempo, podemos construir resiliência evoluindo os scrapers para nos adaptarmos às mudanças de ofuscação.
Raspando APIs ocultas com proxies
APIs da web ocultas geralmente empregam técnicas avançadas de anti-raspagem, como limitação de taxa de IP, captcha e detecção de bot para impedir o acesso.
É aqui que os proxies são muito úteis para raspagem. Ao rotear solicitações por meio de IPs residenciais, podemos contornar muitas proteções e acessar APIs em grande escala.
Algumas dicas para raspar com proxies:
Use a rotação regular de proxy para evitar o bloqueio em IPs específicos
Habilite a rotação de proxy com base em regiões ou ISPs para ampla diversidade
Use proxies de backconnect que fornecem milhares de IPs exclusivos para percorrer
Limite as taxas de solicitação por proxy para imitar o comportamento real do usuário
Empregue autorização de proxy para representar dispositivos reais, não apenas IPs anônimos
Monitore e lide com bloqueios comuns como captchas, páginas de bloqueio, 429s
Com a configuração correta do proxy, podemos acessar praticamente qualquer site de destino ou API oculta.
Serviços de extração de dados ocultos
Existem também serviços de raspagem gerenciados desenvolvidos especificamente para extrair dados renderizados em JavaScript.
Eles fornecem automação do navegador, gerenciamento de proxy e recursos de execução de JavaScript.
Alguns exemplos incluem:
RaspagemBee – API de navegador e proxy que pode avaliar JS em páginas.
RaspadorAPI – API de navegador sem cabeça com rotação automática de proxy.
Apificar – Tempo de execução do ator para automação do navegador em escala.
ScrapeOps – Construtor visual de automação de navegador com extração JS.
Scrap Fly – API de scraping desbloqueável com milhões de proxies residenciais de backconnect.
Esses serviços lidam com todas as complexidades da renderização dinâmica de páginas e facilitam a extração de dados ocultos.
Principais lições
Aqui estão os pontos-chave para extrair dados ocultos de sites:
Inspecione páginas sem JavaScript para confirmar se os dados são carregados dinamicamente
Extraia e analise scripts, variáveis e objetos JSON de HTML
Analise e replique solicitações AJAX para acessar APIs ocultas
Use proxies e navegadores headless quando necessário para sites JS pesados
Correspondência de padrões e código ofuscado por engenharia reversa
Adapte raspadores para lidar com proteções anti-bot
Com as técnicas corretas, praticamente todos os dados de sites públicos podem ser extraídos. Só precisamos saber onde procurar!
