n8n+DiffHook

n8n + Playwright — scraping renderizado sem frota de navegadores

O DiffHook executa Playwright por você a cada checagem, espera a página terminar de renderizar, faz o diff do resultado e envia as mudanças para o n8n por um webhook assinado. Sem Chromium headless para instalar, sem plugins stealth para corrigir.

Raspar uma SPA React ou Vue a partir do n8n normalmente significa juntar o nó Browserless, uma imagem Docker customizada com Playwright instalado ou uma API de scraping de terceiros com sua própria dança de auth e rate limit. Todas colocam um navegador dentro do seu deploy do n8n. O DiffHook inverte o modelo: o navegador roda do nosso lado, totalmente gerenciado, e só o diff atravessa a rede — o resto continua sendo o mesmo padrão webhook do n8n.

n8n

O hub completo de n8n + DiffHook

Todas as receitas, templates e planos de n8n em um só lugar.

Fluxo

Conecte diffs renderizados por Playwright ao n8n em 5 passos

Sem imagem Docker, sem crédito no Browserless, sem instalação de Playwright. O navegador mora dentro do DiffHook.

01

Exponha um webhook do n8n

Crie ou reaproveite um fluxo n8n com um nó disparador Webhook. Copie a URL de produção — o DiffHook vai entregar nela sempre que o DOM renderizado mudar.

02

Escolha html_rendered e o motor Playwright

Defina type como html_rendered e render.engine como playwright. Adicione wait_for_selector ou wait_until: networkidle para que o DiffHook só tire o snapshot depois que a app cliente assentar.

03

Isole o alvo com um seletor CSS

Depois que o Playwright termina o render, o DiffHook aplica o seletor no DOM resolvido. Um seletor apertado mantém o diff focado e evita que fluxos n8n disparem por mudanças de UI irrelevantes.

04

Registre o monitor

Um POST em /v1/monitors com URL, configuração de render, seletor, intervalo e o webhook do n8n como entrega. O DiffHook agenda as execuções do navegador e guarda em cache o último DOM válido.

05

Receba o diff pós-render no n8n

A cada mudança, o trigger Webhook do n8n dispara com previous_value, current_value e os metadados de render. Verifique o HMAC e roteie o diff para os nós seguintes como faria com uma página estática.

Exemplo de API

Monitor renderizado por Playwright em um POST

render.engine escolhe o navegador — troque para puppeteer quando quiser. wait_for_selector mantém o snapshot estável em páginas cheias de JS.

POST /v1/monitors
POST https://api.diffhook.com/v1/monitors
Authorization: Bearer $DIFFHOOK_API_KEY
Content-Type: application/json

{
  "type": "html_rendered",
  "url": "https://spa.example.com/dashboard",
  "render": { "engine": "playwright", "wait_for_selector": ".data-loaded" },
  "css_selector": "#metric-value",
  "interval_seconds": 600,
  "deliveries": [
    {
      "type": "webhook",
      "url": "https://n8n.yourdomain.com/webhook/rendered-change"
    }
  ]
}

Fluxo importável

Comece com um fluxo n8n pronto

O template verifica o HMAC, pega o texto extraído do DOM renderizado e publica um resumo limpo no Slack. Importe, cole a chave, pronto.

Perguntas frequentes

n8n Playwright — perguntas comuns

Quando escolher Playwright em vez do motor HTML comum?
Sempre que o conteúdo que importa for renderizado no cliente — React, Vue, Svelte ou qualquer coisa que busque dados depois do carregamento do documento. Se um curl na URL retorna uma casca vazia ou um placeholder «loading», você precisa de html_rendered. Se o dado já está no HTML que o DiffHook baixa com um fetch, fique no html_css — é bem mais rápido e barato.
Como o DiffHook decide que a página terminou de renderizar?
Dois mecanismos. Ou wait_for_selector (o DiffHook espera até 30 segundos pelo seletor aparecer no DOM) ou wait_until: networkidle (a página é considerada pronta quando não há requisições de rede por 500 ms). Ambos são configuráveis por monitor para ajustar a sites caprichosos.
Posso passar headers ou cookies customizados para o Playwright?
Sim. Cada monitor aceita um mapa request_headers e um array cookies. Tokens de auth, cookies de preferência regional, fixações de teste A/B — tudo pode ficar no escopo do monitor e guardado criptografado. Útil quando a visão renderizada muda por segmento de usuário e você quer vigiar um específico.
O Playwright pesa mais nos limites do plano?
Checagens renderizadas contam mais que as HTML simples (usam um navegador de verdade), mas a proporção é limitada. O plano gratuito libera um número pequeno de checagens renderizadas por dia; planos pagos escalam linearmente. O painel mostra o custo efetivo de cada monitor, sem surpresas.
E quanto a CAPTCHAs e proteção antibot?
A frota Playwright do DiffHook roda com user agents realistas, fingerprints TLS e patches stealth, o que resolve a maioria das regras WAF genéricas. Para sites atrás de Cloudflare Turnstile ou hCaptcha, você pode passar um token resolvido via request_headers ou trocar para o motor Puppeteer, que tem perfis de navegador diferentes — às vezes um passa onde o outro fica travado.

Fluxos relacionados

Também ótimos com o DiffHook

Pare de hospedar um navegador só para diferenciar uma página

Scraping renderizado, motores Playwright e Puppeteer, webhooks assinados com HMAC, plano gratuito. Comece em menos de um minuto.