Scraping de Site Dinâmico

Websites dinâmicos carregam conteúdo usando JavaScript após o carregamento inicial da página. Este guia mostra como coletar dados desses sites usando o endpoint de browser do FourA.

O Problema

Quando você envia uma request HTTP padrão para um website com muito JavaScript, você obtém o esqueleto HTML, mas não o conteúdo real. Os dados que você precisa (listagens de produtos, preços, resultados de busca) são carregados por JavaScript após a renderização da página em um browser.

Isso é cada vez mais comum com frameworks modernos como React, Vue, Angular e Next.js.

A Solução: Requests de Browser

O endpoint de browser do FourA (POST /api/browser/) abre sua URL em uma instância de browser Chrome que:

1. Carrega a página
2. Executa todo o JavaScript
3. Aguarda a renderização do conteúdo
4. Retorna o HTML totalmente renderizado

Passo 1: Identifique o que Você Precisa

Antes de fazer a request, visite a página de destino no seu browser e use o DevTools (F12) para encontrar um trecho de texto ou elemento que confirme que o conteúdo foi carregado. Por exemplo:

• Um nome de produto que aparece após a renderização do JS
• Uma classe CSS como product-grid no HTML renderizado
• Uma string de texto como "results" que só aparece quando os dados são carregados

Passo 2: Envie uma Request de Browser

curl -X POST https://eu.api.foura.ai/api/browser/ \
  -H "X-API-Key: YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "url": "https://example.com/products",
    "timeout_ms": 15000,
    "checkText": "product-grid"
  }'

A opção checkText instrui o FourA a verificar se a string "product-grid" aparece na página renderizada. Se ela não aparecer antes do timeout, a request falha, informando que o conteúdo não foi carregado.

Passo 3: Faça o Parse do HTML

A response contém o HTML totalmente renderizado no campo body. Faça o parse dele com sua biblioteca preferida:

Python (BeautifulSoup)

import requests
from bs4 import BeautifulSoup

resp = requests.post("https://eu.api.foura.ai/api/browser/", headers={
    "X-API-Key": "YOUR_API_KEY",
    "Content-Type": "application/json"
}, json={
    "url": "https://example.com/products",
    "timeout_ms": 15000,
    "checkText": "product-grid"
})

html = resp.json()["body"]
soup = BeautifulSoup(html, "html.parser")

for product in soup.select(".product-card"):
    name = product.select_one(".product-name").text.strip()
    price = product.select_one(".product-price").text.strip()
    print(f"{name}: {price}")

Node.js (cheerio)

import * as cheerio from 'cheerio';

const resp = await fetch('https://eu.api.foura.ai/api/browser/', {
  method: 'POST',
  headers: { 'X-API-Key': 'YOUR_API_KEY', 'Content-Type': 'application/json' },
  body: JSON.stringify({
    url: 'https://example.com/products',
    timeout_ms: 15000,
    checkText: 'product-grid'
  })
});

const { body: html } = await resp.json();
const $ = cheerio.load(html);

$('.product-card').each((i, el) => {
  console.log($(el).find('.product-name').text(), $(el).find('.product-price').text());
});

Solução de Problemas

Ainda obtendo conteúdo vazio?

• Verifique se a página realmente usa renderização JavaScript (compare o "Exibir código fonte" com o DevTools)
• Aumente o timeout_ms: algumas páginas carregam lentamente
• Verifique se a página requer autenticação ou cookies (use o parâmetro cookies)

Recebendo uma página de CAPTCHA?

• Para requests simples/HTTP, mude para o endpoint de proxy (POST /api/proxy/) para rotação automática de IP.
• Para adicionar rotação de proxy a requests de browser, use o parâmetro proxy do endpoint de browser em vez de envelopar no endpoint de proxy. O endpoint de proxy apenas envolve requests simples/HTTP, não requests de browser.

curl -X POST "https://eu.api.foura.ai/api/browser/" \
  -H "X-API-Key: YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"url": "https://example.com", "proxy": "http://proxy-url:port"}'

Próximos Passos

• Escolhendo o Endpoint Correto: Quando usar browser vs. single
• Monitorar Preços de Concorrentes: Tutorial completo de monitoramento de preços
• Proteção Anti-Bot: Como lidar com sites protegidos