Scraping de Site Dinâmico
Sites 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 navegador da FourA.
O Problema
Quando você envia um request HTTP padrão para um site com muito JavaScript, você recebe a estrutura HTML, mas não o conteúdo real. Os dados que você precisa (listas de produtos, preços, resultados de busca) são carregados por JavaScript após a página renderizar em um navegador.
Isso é cada vez mais comum com frameworks modernos como React, Vue, Angular e Next.js.
A Solução: Browser Requests
O endpoint de navegador da FourA (POST /api/browser/) abre sua URL em uma instância do navegador Chrome que:
- Carrega a página
- Executa todo o JavaScript
- Aguarda a renderização do conteúdo
- Retorna o HTML totalmente renderizado
Passo 1: Identifique o que você precisa
Antes de fazer o request, visite a página alvo no seu navegador 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 o JS renderizar
- Uma classe CSS como
product-gridno HTML renderizado - Uma string de texto como "resultados" que só aparece quando os dados são carregados
Passo 2: Envie um Browser Request
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 diz ao FourA para verificar se a string "product-grid" aparece na página renderizada. Se não aparecer antes do timeout, o request falha, informando que o conteúdo não carregou.
Passo 3: Fazer o parse do HTML
O response contém o HTML totalmente renderizado no campo body. Faça o parse com a 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 está recebendo conteúdo vazio?
- Verifique se a página realmente usa renderização JavaScript (compare "Exibir código-fonte" com o DevTools)
- Aumente
timeout_ms: algumas páginas carregam lentamente - Verifique se a página requer autenticação ou cookies (use o parâmetro
cookies)
Está recebendo uma página de CAPTCHA?
- Para requests únicos/HTTP, mude para o endpoint do proxy (
POST /api/proxy/) para rotação automática de IP. - Para rotear um request de navegador por um proxy, passe o parâmetro
proxydo endpoint do navegador. O endpoint do proxy envolve apenas requests únicos/HTTP, não requests de navegador.
O parâmetro proxy aceita o ID opaco de proxy que uma response anterior retornou, nunca um endereço de proxy próprio. Execute uma chamada POST /api/proxy/ (ou POST /api/auto/) primeiro, leia o campo proxy que ela retorna e, em seguida, fixe-o:
# Step 1: let FourA find a working exit. The response carries "proxy": "A1B2C3".
curl -X POST "https://eu.api.foura.ai/api/proxy/" \
-H "X-API-Key: YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{"maxTries": 5, "request": {"method": "GET", "url": "https://example.com/products"}}'
# Step 2: render through that same exit.
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", "proxy": "A1B2C3", "timeout_ms": 20000}'
Enviar um endereço em vez de um ID retorna como 400 Invalid proxy format. O padrão completo está em Reutilizar um Proxy Entre Requests.
Próximos Passos
- Escolhendo o Endpoint Correto: Quando usar browser vs. single
- Monitorar Preços da Concorrência: Tutorial completo de rastreamento de preços
- Proteção Anti-Bot: Lidar com sites protegidos
- Reutilizar um Proxy Entre Requests: Fixar uma saída em todo um fluxo de trabalho