n8n+DiffHook

n8n + Puppeteer — Headless-Chrome-Scraping ohne Betriebslast

DiffHook steuert Puppeteer für Sie, wartet, bis sich das DOM beruhigt, vergleicht das Ergebnis mit dem vorherigen Snapshot und liefert Änderungen per signiertem Webhook an n8n. Keine Chromium-Binary, kein Docker-Image, kein Neustart-bei-OOM.

Puppeteer innerhalb eines n8n-Deployments zu hosten ist ein klassischer Footgun: Die Chromium-Binary bläht das Image auf, Worker lecken Speicher nach ein paar hundert Runs und jede Seitenänderung zerschießt das Selektor-Skript um drei Uhr nachts. DiffHook holt den Browser in eine gemanagte Flotte. Sie beschreiben einmal, was zu beobachten ist, und n8n sieht nur das Post-Render-Diff — nie die Browser-Crashes, nie die Kaltstart-Latenz, nie den Versions-Drift der Stealth-Plugins.

n8n

Der vollstaendige n8n-+-DiffHook-Hub

Alle n8n-Rezepte, Templates und Preise an einem Ort.

Workflow

Puppeteer-gerenderte Diffs in n8n einbinden in 5 Schritten

Der Browser läuft auf unserer Seite. n8n sieht nur Änderungen — keine Kaltstarts, keine Zombie-Chromium-Prozesse.

01

n8n-Webhook bereitstellen

Fügen Sie einem neuen oder bestehenden n8n-Workflow einen Webhook-Trigger-Node hinzu und notieren Sie die Produktions-URL. Das ist das Ziel, an das DiffHook POSTet, wenn sich das gerenderte DOM ändert.

02

html_rendered und Puppeteer-Engine wählen

Setzen Sie type auf html_rendered und render.engine auf puppeteer. Ergänzen Sie wait_for_selector oder wait_until: networkidle, damit DiffHook den Snapshot erst zieht, nachdem die Seite JS und Daten fertig geladen hat.

03

Das richtige Element per Selektor anvisieren

DiffHook führt den CSS-Selektor gegen das gerenderte DOM aus. Ein enger Selektor (eine bestimmte Produktkarte, eine Preis-Zeile, ein Status-Banner) hält das Diff fokussiert und lässt n8n nur auf das Signal reagieren, das zählt.

04

Monitor anlegen

POST an /v1/monitors mit URL, Render-Konfiguration, Selektor, Intervall und einer Webhook-Zustellung zur n8n-URL. DiffHook plant die Puppeteer-Runs — Sie besitzen nichts Browser-förmiges.

05

In n8n auf Änderungen reagieren

Wenn sich die Ausgabe des gerenderten Selektors ändert, feuert der Webhook-Node von n8n mit einem signierten JSON-Body: previous_value, current_value, url, detected_at. HMAC prüfen, dann das Diff in die nachgelagerten Schritte routen.

API-Beispiel

Puppeteer-gerenderter Monitor, ein POST

render.engine wählt den Browser. Puppeteer ist der gute Default für Seiten, die gezielt Chrome-Fingerprints testen.

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/pricing",
  "render": { "engine": "puppeteer", "wait_for_selector": "[data-ready]" },
  "css_selector": "main .plan",
  "interval_seconds": 600,
  "deliveries": [
    {
      "type": "webhook",
      "url": "https://n8n.yourdomain.com/webhook/spa-pricing"
    }
  ]
}

Importierbarer Workflow

Mit einem fertigen n8n-Workflow starten

Das Template prüft HMAC, parst das Puppeteer-gerenderte HTML mit HTML Extract und schiebt strukturierte Zeilen in eine Notion-Datenbank. Ziel-Node nach Belieben anpassen.

FAQ

n8n Puppeteer — häufige Fragen

Puppeteer vs Playwright — welche Engine nehmen?
Für ~95 % der Seiten austauschbar. Nehmen Sie Puppeteer, wenn das Ziel explizit Chrome-Features testet (Chrome-DevTools-Protocol-Aufrufe, Chrome-spezifische Browser-APIs) oder wenn Sie eine Seite gefunden haben, die sich unter beiden unterschiedlich verhält. Nehmen Sie Playwright, wenn Sie feinere Kontrolle über Waits brauchen oder die Seite mit dem Default-Profil von Playwright besser läuft. Das Umschalten ist eine einzige Zeile in der Monitor-Konfiguration.
Muss ich irgendwo eigenes Chromium laufen lassen?
Nein. DiffHook hostet die Chromium-Flotte, hält sie aktuell und recycelt Worker zwischen Runs. Sie schicken nur den POST. Das ist der Hauptgrund, warum dieses Muster „n8n + Puppeteer-Node" schlägt: keine Binary zum Installieren, kein Image zur Wartung, kein Worker-Crash-Alert zu triagieren.
Wie geht DiffHook mit Seiten um, die Inhalte beim Scrollen lazy-laden?
Zwei Optionen. Sie können scroll_to_bottom: true setzen, damit Puppeteer die Seite vor dem Snapshot automatisch scrollt, oder einen wait_for_selector liefern, der erst erscheint, sobald der lazy-geladene Inhalt gemountet ist. Beides funktioniert für Infinite-Scroll-Produktlisten, lazy-geladene Changelogs und Intersection-Observer-Widgets.
Kann ich Auth-Cookies in Puppeteer mitgeben?
Ja. Jeder Monitor hat ein cookies-Array und eine request_headers-Map, beides verschlüsselt gespeichert. Nützlich, wenn Sie die authentifizierte Ansicht einer App beobachten wollen — ein Dashboard hinter Login, eine mandantenspezifische SaaS-Seite. Anmeldedaten jederzeit im Dashboard rotieren oder widerrufen.
Wie dicht taktet man gerenderte Monitore?
Gleiche Minimalintervalle wie bei statischen Monitoren — 60 Sekunden auf kostenpflichtigen Tarifen, stündlich im Free-Tier. Der Browser macht jeden Check in Tarif-Kontingent teurer, aber das Dashboard zeigt immer die effektiven Kosten pro Monitor, sodass es keinen Abgrund gibt.

Verwandte Workflows

Auch großartig mit DiffHook

Hören Sie auf, Chromium mit Ihrem n8n-Image auszuliefern

Gemanagte Puppeteer-Flotte, HMAC-signierte Webhooks, 60-Sekunden-Checks, kostenloser Tarif. In Minuten in Produktion.