Parsing e raspagem de dados em JavaScript: do iniciante ao profissional

Por que fazer parsing de dados em JavaScript, se existe Python?

Olá, amigo! Se você está lendo este texto, provavelmente já conhece Python e suas bibliotecas como BeautifulSoup ou Scrapy. Mas e se você se deparar com uma tarefa onde Python não dá conta? Por exemplo, precisa coletar dados de um site que é totalmente construído em React ou Angular. Toda a informação é carregada via JavaScript, e no HTML original — vazio. É aí que o JavaScript entra em cena!

Parsing e raspagem de dados em JavaScript não é apenas uma tendência da moda, mas uma necessidade urgente para trabalhar com aplicações web modernas. O Node.js permite executar o motor do navegador diretamente no servidor, processar o DOM, clicar em botões e aguardar o carregamento de conteúdo assíncrono. Neste artigo, vamos explorar ferramentas reais e escrever código que você pode usar imediatamente em seus projetos.

Prontos para transformar o JavaScript em um poderoso aspirador de dados? Vamos nessa!

Principais ferramentas para scraping em JavaScript

Antes de escrever código, vamos conhecer os principais "lutadores" do nosso arsenal. Para parsing de dados em JavaScript, usaremos três pilares:

\n
• Axios — cliente HTTP para enviar requisições e obter o código HTML das páginas.
\n
• Cheerio — biblioteca rápida e leve para parsing de HTML, que funciona como jQuery no servidor.
\n
• Puppeteer — navegador headless completo (Chrome) que consegue executar JavaScript, clicar, rolar e esperar.
\n

Para páginas estáticas, Axios + Cheerio são suficientes. Se o site carrega dados via AJAX ou requer autenticação — use o Puppeteer. Agora vamos à prática.

Exemplo 1: Parsing simples de página estática com Cheerio

Suponha que precisamos coletar os títulos de notícias de um site que entrega o HTML diretamente (sem dinâmica). Instalamos as dependências:

npm install axios cheerio

Agora vamos escrever um script que extrai todos os títulos h2 da página inicial (substitua a URL por uma real):

const axios = require('axios');\nconst cheerio = require('cheerio');\n\nasync function parseStaticPage(url) {\n    try {\n        const { data } = await axios.get(url);\n        const $ = cheerio.load(data);\n\n        const titles = [];\n        $('h2').each((i, el) => {\n            titles.push($(el).text().trim());\n        });\n\n        console.log('Títulos encontrados:');\n        titles.forEach((title, index) => {\n            console.log(`${index + 1}. ${title}`);\n        });\n    } catch (error) {\n        console.error('Erro de parsing:', error.message);\n    }\n}\n\nparseStaticPage('https://example.com/news');

Este código é a base para começar a estudar raspagem de dados em JavaScript. O Cheerio funciona rapidamente, mas não consegue executar scripts. Se o site mostrar "Carregando..." — continue lendo.

Exemplo 2: Parsing de páginas dinâmicas com Puppeteer

Agora imagine que os dados só aparecem depois que o usuário rola a página ou clica no botão "Mostrar mais". Para essas tarefas, o Puppeteer é ideal. Vamos instalá-lo:

npm install puppeteer

Cenário: entramos em uma página de produtos, esperamos 3 segundos (enquanto o JS carrega), depois coletamos os nomes dos produtos:

const puppeteer = require('puppeteer');\n\nasync function parseDynamicPage(url) {\n    const browser = await puppeteer.launch({ headless: true });\n    const page = await browser.newPage();\n\n    await page.goto(url, { waitUntil: 'networkidle2' });\n    // Aguarda o aparecimento do conteúdo (seletor .product-title)\n    await page.waitForSelector('.product-title', { timeout: 10000 });\n\n    const items = await page.evaluate(() => {\n        const titles = [];\n        document.querySelectorAll('.product-title').forEach(el => {