n8n workflow - Gebruik maken van Headless browser

Download de volledige workflow hier

Benodigdheden

1. Een n8n Business server of hoger (zie https://www.hoasted.com/hosting/n8n-vps/)
2. Een community node voor Browserless (kan aangevraagd worden via support)

Browserless community node toevoegen

Allereerst zal de Browserless community node toegevoegd moeten worden aan de server. Deze kun je door onze support laten installeren, of wanneer je zelf admin toegang hebt via "n8n-nodes-browserless".

Chromium credentials toevoegen

Voeg een nieuwe 'Headless Chrome' credential toe, en gebruik hierbij de URL 'http://chromium:3000. Als token kun je de naam van je n8n instance gebruiken (XXX.n8p1.hostingsecure.com).

Headless browser gebruiken in je workflow

Om nu aan de slag te gaan met de headless browser kun je de 'Browserless' node toevoegen aan je workflow, en hier onderstaande code in plakken. Hiermee zal direct een user-agent meegegeven worden, wat voor veel websites een vereiste is om de verbinding niet te blokkeren.

export default async function ({ page, context }) {

  await page.setViewport({ width: 1500, height: 900 });
await page.setExtraHTTPHeaders({
    "User-Agent":
      "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/117.0.5938.62 Safari/537.36",
    "Upgrade-Insecure-Requests": "1",
    "Sec-Fetch-Site": "none",
    "Sec-Fetch-Mode": "navigate",
    "Sec-Fetch-User": "?1",
    "Sec-Fetch-Dest": "document",
  });

  await page.emulateMediaFeatures([
    { name: "prefers-color-scheme", value: "light" },
  ]);

  const url = "https://www.hoasted.com/";

  await page.goto(url, { waitUntil: "domcontentloaded" });

  // Screenshot
  const screenshot = await page.screenshot({
    encoding: "base64",
    fullPage: true,
  });

  return { data: screenshot, type: "image/png" };
}