n8n+DiffHook

n8n + Playwright — scraping renderizzato senza flotta di browser

DiffHook esegue Playwright per te a ogni controllo, aspetta che la pagina finisca il rendering, diffa il risultato e fa POST dei cambiamenti su n8n tramite un webhook firmato. Nessun Chromium headless da installare, nessun plugin stealth da patchare.

Scrapare una SPA React o Vue da n8n di solito significa mettere insieme il nodo Browserless, un'immagine Docker custom con Playwright installato o un'API di scraping di terze parti con il suo balletto di auth e rate limit. Tutte mettono un browser dentro il tuo deployment n8n. DiffHook ribalta il modello: il browser gira dalla nostra parte, completamente gestito, e solo il diff attraversa la rete — il resto rimane il solito schema webhook di n8n.

Inizia gratisLeggi la documentazione del motore di rendering
n8n

L hub completo di n8n + DiffHook

Tutte le ricette, i template e i prezzi n8n in un unico posto.

Flusso

Collega i diff renderizzati da Playwright a n8n in 5 passi

Nessuna immagine Docker, nessun credito Browserless, nessuna installazione di Playwright. Il browser vive dentro DiffHook.

01

Esporre un webhook n8n

Crea o riusa un flusso n8n con un nodo trigger Webhook. Copia l'URL di produzione — DiffHook consegnerà lì ogni volta che il DOM renderizzato cambia.

02

Scegliere html_rendered e il motore Playwright

Imposta type su html_rendered e render.engine su playwright. Aggiungi wait_for_selector o wait_until: networkidle in modo che DiffHook faccia lo snapshot solo quando la app lato client si è assestata.

03

Isolare il bersaglio con un selettore CSS

Dopo che Playwright ha finito il rendering, DiffHook esegue il selettore sul DOM risolto. Un selettore stretto mantiene il diff focalizzato ed evita che i flussi n8n partano per cambi di UI non pertinenti.

04

Registrare il monitor

Un POST a /v1/monitors con URL, configurazione di rendering, selettore, intervallo e il webhook n8n come consegna. DiffHook pianifica le run del browser e mette in cache l'ultimo DOM valido.

05

Ricevere il diff post-render in n8n

A ogni cambiamento il trigger Webhook di n8n parte con previous_value, current_value e i metadati di rendering. Verifica l'HMAC, poi instrada il diff ai nodi come faresti per una pagina statica.

Esempio API

Monitor renderizzato da Playwright, un POST

render.engine sceglie il browser — passa a puppeteer quando vuoi. wait_for_selector tiene lo snapshot stabile su pagine JS pesanti.

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"
    }
  ]
}

Flusso importabile

Parti da un flusso n8n già pronto

Il template verifica l'HMAC, tira fuori il testo estratto dal DOM renderizzato e pubblica un riassunto pulito su Slack. Importa, incolla la chiave, fatto.

Vedi il template n8n su GitHub

FAQ

n8n Playwright — domande frequenti

Quando scegliere Playwright invece del motore HTML semplice?
Ogni volta che il contenuto che ti interessa è renderizzato lato client — React, Vue, Svelte o qualunque cosa che faccia fetch di dati dopo il caricamento del documento. Se un curl all'URL restituisce un guscio vuoto o un placeholder «loading», ti serve html_rendered. Se il dato è già nell'HTML che DiffHook scarica con un fetch, rimani su html_css — è molto più rapido ed economico.
Come stabilisce DiffHook che la pagina ha finito il rendering?
Due meccanismi. O wait_for_selector (DiffHook aspetta fino a 30 secondi che il selettore compaia nel DOM) o wait_until: networkidle (la pagina è considerata pronta quando non ci sono richieste di rete per 500 ms). Entrambi sono configurabili per monitor per adattarsi a siti capricciosi.
Posso passare header o cookie personalizzati a Playwright?
Sì. Ogni monitor accetta una mappa request_headers e un array cookies. Token di auth, cookie di preferenza regionale, pin di A/B test — tutto può essere ristretto al monitor e salvato cifrato. Utile quando la vista renderizzata cambia per segmento utente e vuoi sorvegliarne uno specifico.
Playwright pesa di più sui limiti del piano?
I check renderizzati contano più dei check HTML semplici (usano un vero browser), ma il rapporto è limitato. Il piano gratuito consente un numero ridotto di check renderizzati al giorno; i piani a pagamento scalano linearmente. Il pannello mostra il costo effettivo di ogni monitor, così non ci sono sorprese.
E CAPTCHA e protezione anti-bot?
La flotta Playwright di DiffHook gira con user agent realistici, TLS fingerprint e patch stealth, che gestiscono la maggior parte delle regole WAF generiche. Per siti dietro Cloudflare Turnstile o hCaptcha puoi passare un token risolto via request_headers o passare al motore Puppeteer che ha profili di browser diversi — a volte uno passa dove l'altro si blocca.

Flussi correlati

Perfetti anche con DiffHook

n8n + Puppeteer

Lo stesso pattern di scraping renderizzato con Puppeteer — utile quando un sito si comporta diversamente sotto Chromium.

Web scraping n8n

Scraping di HTML statico per pagine che non hanno bisogno di un browser — più economico e veloce quando è possibile.

Webhook n8n

Approfondisci verifica HMAC, retry e replay nella pagina generica di n8n-webhook.

Web scraping Zapier

Lo stesso motore renderizzato, Zapier come destinazione — forma di monitor identica, URL webhook diverso.

Web scraping Make.com

Invia il diff post-render al modulo webhook di Make.com per instradamento low-code.

Sostituire uno script di scraping

Migri da uno script Playwright + cron? Ecco il monitor gestito confrontato fianco a fianco.

Smetti di ospitare un browser solo per diffare una pagina

Scraping renderizzato, motori Playwright e Puppeteer, webhook firmati HMAC, piano gratuito. Si parte in meno di un minuto.

Crea un account gratuitoVedi i prezzi