n8n+DiffHook

n8n + Playwright — scraper des pages rendues en JS sans flotte de navigateurs

DiffHook exécute Playwright pour vous à chaque vérification, attend que la page finisse son rendu, diff le résultat et POST les changements vers n8n via un webhook signé. Pas de Chromium headless à installer, pas de plugins stealth à patcher.

Scraper une SPA React ou Vue depuis n8n veut en général dire assembler le node Browserless, une image Docker custom avec Playwright installé, ou une API de scraping tierce avec ses propres galères d'auth et de rate limit. Toutes ces solutions mettent un navigateur dans votre déploiement n8n. DiffHook retourne le modèle : le navigateur tourne chez nous, entièrement géré, et seul le diff traverse le réseau — le reste reste le bon vieux pattern webhook n8n.

Commencer gratuitementLire la documentation du moteur de rendu
n8n

Le hub n8n + DiffHook complet

Toutes les recettes, templates et tarifs n8n au même endroit.

Workflow

Brancher les diffs rendus par Playwright sur n8n en 5 étapes

Pas d'image Docker, pas de crédit Browserless, pas d'installation Playwright. Le navigateur vit dans DiffHook.

01

Exposer un webhook n8n

Créez ou réutilisez un workflow n8n avec un node déclencheur Webhook. Copiez l'URL de production — DiffHook livrera dessus à chaque changement du DOM rendu.

02

Choisir html_rendered et le moteur Playwright

Passez type à html_rendered et render.engine à playwright. Ajoutez wait_for_selector ou wait_until: networkidle pour que DiffHook ne prenne le snapshot qu'une fois l'app client-side stabilisée.

03

Isoler la cible avec un sélecteur CSS

Une fois que Playwright a fini de rendre, DiffHook applique le sélecteur sur le DOM résolu. Un sélecteur serré garde le diff focalisé et évite aux workflows n8n de se déclencher sur des changements d'UI sans intérêt.

04

Enregistrer le moniteur

Un POST unique sur /v1/monitors avec URL, configuration de rendu, sélecteur, intervalle, et le webhook n8n en livraison. DiffHook planifie les runs navigateur et met en cache le dernier DOM valide.

05

Recevoir le diff post-rendu dans n8n

À chaque changement, le déclencheur Webhook n8n se lance avec previous_value, current_value et les métadonnées de rendu. Vérifiez le HMAC, puis routez le diff vers vos nodes exactement comme pour une page statique.

Exemple d'API

Moniteur rendu par Playwright, un POST

render.engine choisit le navigateur — basculez vers puppeteer à tout moment. wait_for_selector garde le snapshot stable sur les pages JS lourdes.

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

Workflow importable

Démarrez avec un workflow n8n prêt à l'emploi

Le template vérifie le HMAC, extrait le texte rendu du DOM et poste un résumé propre sur Slack. Importez, collez votre clé, c'est fini.

Voir le template n8n sur GitHub

FAQ

n8n Playwright — questions fréquentes

Quand choisir Playwright plutôt que le moteur HTML classique ?
Dès que le contenu qui vous intéresse est rendu côté client — React, Vue, Svelte, ou tout ce qui fetch de la donnée après le chargement du document. Si un curl sur l'URL renvoie une coque vide ou un placeholder « loading », il vous faut html_rendered. Si la donnée est déjà dans le HTML que DiffHook télécharge avec un fetch, restez sur html_css — c'est bien plus rapide et moins cher.
Comment DiffHook décide-t-il que la page a fini de rendre ?
Deux mécanismes. Soit wait_for_selector (DiffHook attend jusqu'à 30 secondes que le sélecteur apparaisse dans le DOM) soit wait_until: networkidle (la page est considérée prête une fois qu'il n'y a plus de requête réseau pendant 500 ms). Les deux sont configurables par moniteur pour s'ajuster aux sites capricieux.
Puis-je passer des headers ou cookies customisés à Playwright ?
Oui. Chaque moniteur accepte une map request_headers et un tableau cookies. Tokens d'auth, cookies de préférence régionale, épinglages de test A/B — tout peut être limité au moniteur et stocké chiffré. Utile quand la vue rendue change selon le segment utilisateur et que vous voulez en surveiller un en particulier.
Playwright pèse-t-il plus lourd sur mes quotas ?
Les vérifications rendues comptent pour plus qu'une vérification HTML simple (elles utilisent un vrai navigateur), mais le ratio est borné. L'offre gratuite autorise un petit nombre de vérifications rendues par jour ; les offres payantes scalent linéairement. Le tableau de bord affiche le coût effectif de chaque moniteur pour qu'il n'y ait pas de surprise.
Et les CAPTCHA et protections bot ?
La flotte Playwright de DiffHook tourne avec des user agents réalistes, des empreintes TLS et des patchs stealth, ce qui règle la plupart des règles WAF génériques. Pour les sites derrière Cloudflare Turnstile ou hCaptcha, vous pouvez passer un token résolu via request_headers ou basculer sur le moteur Puppeteer qui a des profils navigateur différents — parfois l'un passe là où l'autre est bloqué.

Workflows associés

Aussi parfait avec DiffHook

n8n + Puppeteer

Le même pattern de scraping rendu avec Puppeteer — utile quand un site se comporte différemment sous Chromium.

Scraping web n8n

Scraping de HTML statique pour les pages qui n'ont pas besoin de navigateur — plus rapide et moins cher quand ça marche.

Webhook n8n

Creusez la vérification HMAC, les retries et le replay sur la page n8n-webhook générique.

Scraping web Zapier

Même moteur rendu, Zapier en destination — forme de moniteur identique, URL webhook différente.

Scraping web Make.com

Canalisez le diff post-rendu vers le module webhook de Make.com pour un routage low-code.

Remplacer un script de scraping

Vous migrez d'un script Playwright + cron ? Voyez à quoi ressemble le moniteur géré comparé côte à côte.

Arrêtez d'héberger un navigateur juste pour differ une page

Scraping rendu, moteurs Playwright et Puppeteer, webhooks signés HMAC, offre gratuite. Démarrage en moins d'une minute.

Créer un compte gratuitVoir les tarifs