Webhook erstellen: Der komplette Guide für Anfänger (mit n8n und Make.com)

Webhooks sind das Rückgrat moderner Automatisierung. Statt ständig nach Updates zu fragen, werden Sie automatisch benachrichtigt, wenn etwas passiert. In diesem Guide erklären wir Webhooks von Grund auf – was sie sind, wie sie funktionieren, und wie Sie sie praktisch einsetzen.

Was ist ein Webhook?

Einfache Erklärung:

Ein Webhook ist wie ein Klingelknopf. Statt alle 5 Minuten zur Tür zu gehen und nachzuschauen (Polling), drückt der Besucher die Klingel und Sie werden sofort informiert.

Technisch:

Ein Webhook ist ein HTTP POST Request, den ein Service an Ihre URL sendet, wenn ein Ereignis eintritt. Webhooks sind eine Sonderform der API-Integration und werden in fast allen modernen Automatisierungstools genutzt.

Polling vs. Webhook

Aspekt	Polling	Webhook
Initiator	Sie fragen an	Service informiert Sie
Latenz	Minuten (je nach Intervall)	Echtzeit (Sekunden)
Ressourcen	Viele unnötige Anfragen	Nur bei Events
Komplexität	Einfacher aufzusetzen	Braucht öffentliche URL

Wie funktionieren Webhooks?

Der Ablauf

1. Sie registrieren Ihre URL beim Service
        ↓
Ereignis tritt ein (z.B. neue Bestellung)
        ↓
Service sendet POST Request an Ihre URL
        ↓
Ihr Server empfängt die Daten
        ↓
Sie verarbeiten die Daten
        ↓
Sie antworten mit 200 OK

Ein typischer Webhook Request

POST /webhook/orders HTTP/1.1 Host: ihre-domain.de Content-Type: application/json X-Webhook-Signature: sha256=abc123... { "event": "order.created", "timestamp": "2024-01-15T10:30:00Z", "data": { "orderId": "12345", "customerEmail": "kunde@example.com", "total": 99.00 }

}

Webhook-Endpoint erstellen

Option 1: n8n Webhook

Schritt 1: Webhook Node hinzufügen

Neuen Workflow erstellen

"Webhook" Node hinzufügen

Konfiguration:

- HTTP Method: POST

- Path: orders (wird zu /webhook/orders)

- Response Mode: When Last Node Finishes

Schritt 2: URL kopieren

n8n zeigt zwei URLs:

Test URL: Für Entwicklung (nur wenn Workflow offen)
Production URL: Für Live-Betrieb (nach Aktivierung)

Test: https://n8n.ihre-domain.de/webhook-test/orders

Prod: https://n8n.ihre-domain.de/webhook/orders

Schritt 3: Daten verarbeiten

// Node: Code
// Webhook-Daten verarbeiten

const event = $json.body.event;
const data = $json.body.data;

console.log(Event: ${event});
console.log(Order ID: ${data.orderId});

return {
  orderId: data.orderId,
  email: data.customerEmail,
  total: data.total,
  processedAt: new Date().toISOString()
};

Option 2: Make.com Webhook

Schritt 1: Custom Webhook erstellen

Neues Szenario

Trigger: "Webhooks" → "Custom webhook"

"Add" klicken → Name vergeben

URL kopieren

https://hook.eu1.make.com/abc123xyz456

Schritt 2: Struktur definieren

Entweder:

Automatisch beim ersten Request
Oder manuell im "Data structure" Tab

Option 3: Eigener Server (Node.js)

const express = require('express');
const app = express();

app.use(express.json());

app.post('/webhook/orders', (req, res) => {
  const { event, data } = req.body;

  console.log('Webhook received:', event);

  // Hier: Daten verarbeiten
  processOrder(data);

  // Immer 200 OK antworten (schnell!)
  res.status(200).json({ received: true });
});

app.listen(3000);

Webhooks absichern

1. Signatur-Verifizierung

Die meisten Services signieren ihre Webhooks:

const crypto = require('crypto');

function verifySignature(payload, signature, secret) {
  const computed = crypto
    .createHmac('sha256', secret)
    .update(payload)
    .digest('hex');

  return computed === signature;
}

// In Ihrem Webhook-Handler:
const isValid = verifySignature(
  JSON.stringify(req.body),
  req.headers['x-webhook-signature'],
  process.env.WEBHOOK_SECRET
);

if (!isValid) {
  return res.status(401).json({ error: 'Invalid signature' });
}

2. IP-Whitelisting

Nur Requests von bekannten IPs akzeptieren:

const allowedIPs = ['192.168.1.1', '10.0.0.1'];

if (!allowedIPs.includes(req.ip)) {
  return res.status(403).json({ error: 'IP not allowed' });
}

3. HTTPS verwenden

Webhooks sollten IMMER über HTTPS laufen – nie HTTP.

4. Timestamp-Prüfung

Alte Requests ablehnen (Replay-Attacken verhindern):

const timestamp = parseInt(req.headers['x-webhook-timestamp']);
const now = Math.floor(Date.now() / 1000);

if (now - timestamp > 300) { // Älter als 5 Minuten
  return res.status(400).json({ error: 'Request too old' });
}

Praktische Beispiele

Beispiel 1: Shopify Order Webhook

Webhook registrieren (Shopify Admin):

Settings → Notifications → Webhooks

"Create webhook" → Event: "Order creation"

URL: Ihre n8n/Make.com URL

Format: JSON

Payload-Beispiel:

{ "id": 820982911946154500, "email": "kunde@example.com", "created_at": "2024-01-15T10:30:00+01:00", "total_price": "199.00", "line_items": [ { "title": "Produkt A", "quantity": 2, "price": "99.50" } ]

}

n8n Workflow:

Shopify Webhook ↓ Daten extrahieren ↓ Parallel: ├─ Google Sheets: Bestellung loggen ├─ Email: Bestätigung senden

└─ Slack: Team benachrichtigen

Beispiel 2: Stripe Payment Webhook

Eine ausführliche Schritt-für-Schritt-Anleitung finden Sie in unserem Artikel Stripe Webhook einrichten.

Webhook registrieren:

# Stripe Dashboard oder CLI stripe webhooks create \ --url https://n8n.ihre-domain.de/webhook/stripe \

--events payment_intent.succeeded,payment_intent.failed

Payload verarbeiten:

// Node: Switch - Nach Event-Typ
const eventType = $json.type;

switch(eventType) {
  case 'payment_intent.succeeded':
    return { route: 'success' };
  case 'payment_intent.failed':
    return { route: 'failed' };
  default:
    return { route: 'ignore' };
}

Beispiel 3: GitHub Push Webhook

Webhook einrichten:

Repository → Settings → Webhooks → Add webhook

URL: Ihre Webhook-URL

Content type: application/json

Events: Push events

Verwendung:

GitHub Push Webhook ↓ Branch = "main"? ↓ Yes SSH: Deploy-Script ausführen ↓

Slack: Deployment benachrichtigen

Beispiel 4: Typeform Response Webhook

Webhook aktivieren:

Typeform → Connect → Webhooks

URL eingeben

Test senden

Daten nutzen:

// Typeform sendet Antworten strukturiert
const answers = $json.form_response.answers;

const name = answers.find(a => a.field.ref === 'name')?.text;
const email = answers.find(a => a.field.ref === 'email')?.email;
const message = answers.find(a => a.field.ref === 'message')?.text;

return { name, email, message };

Webhook-Debugging

Lokale Entwicklung

Problem: Webhooks brauchen eine öffentliche URL.

Lösung 1: ngrok

# ngrok installieren brew install ngrok # Tunnel starten ngrok http 5678 # Zeigt öffentliche URL

# https://abc123.ngrok.io → localhost:5678

Lösung 2: Stripe CLI

stripe listen --forward-to localhost:5678/webhook/stripe

Request Inspection

Tool: RequestBin / Webhook.site

https://webhook.site öffnen

Unique URL kopieren

Als Webhook-Endpoint verwenden

Alle Requests werden angezeigt

n8n Debug

Workflow öffnen

"Test Workflow" aktivieren

Webhook senden

Daten in jedem Node inspizieren

Fehlerbehandlung

Retries

Wenn Ihr Endpoint ausfällt, versuchen viele Services es erneut:

Service	Retry-Verhalten
Stripe	3 Tage, exponential backoff
Shopify	19 Versuche, 48 Stunden
GitHub	3 Versuche

Idempotenz

Webhooks können mehrfach zugestellt werden. Verarbeiten Sie jeden Event nur einmal:

// Webhook-ID speichern
const webhookId = $json.id;

// Prüfen ob schon verarbeitet
const existing = await db.get('processed_webhooks', webhookId);
if (existing) {
  return { status: 'already_processed' };
}

// Verarbeiten
await processWebhook($json);

// Als verarbeitet markieren
await db.set('processed_webhooks', webhookId, {
  processedAt: new Date().toISOString()
});

Async Processing

Antworten Sie schnell, verarbeiten Sie später:

app.post('/webhook', async (req, res) => {
  // Sofort antworten
  res.status(200).json({ received: true });

  // Async verarbeiten (nach Response)
  setImmediate(async () => {
    try {
      await processWebhook(req.body);
    } catch (error) {
      console.error('Webhook processing failed:', error);
      await alertTeam(error);
    }
  });
});

Webhook-Dokumentation erstellen

Wenn Sie eigene Webhooks anbieten, dokumentieren Sie:

<h2 class="text-2xl font-bold mt-10 mb-6 text-gray-900">Order Created Webhook</h2>

<h3 class="text-xl font-bold mt-8 mb-4 text-gray-900">Trigger</h3>
Wird ausgelöst, wenn eine neue Bestellung erstellt wird.

<h3 class="text-xl font-bold mt-8 mb-4 text-gray-900">HTTP Request</h3>
Method: POST
Content-Type: application/json

<h3 class="text-xl font-bold mt-8 mb-4 text-gray-900">Headers</h3>
Header Beschreibung
X-Webhook-Signature HMAC-SHA256 Signatur
X-Webhook-Timestamp Unix Timestamp
<h3 class="text-xl font-bold mt-8 mb-4 text-gray-900">Payload</h3>

Header	Beschreibung
X-Webhook-Signature	HMAC-SHA256 Signatur
X-Webhook-Timestamp	Unix Timestamp

json

{

"event": "order.created",

"data": {

"orderId": "string",

"customerEmail": "string",

"total": "number"

}

<h3 class="text-xl font-bold mt-8 mb-4 text-gray-900">Response</h3>
Antworten Sie mit HTTP 200 innerhalb von 30 Sekunden.

Kosten

Lösung	Kosten
n8n Cloud	Ab 20€/Monat
Make.com	Ab 9€/Monat
Eigener Server	Ab 5€/Monat (VPS)
Serverless (AWS Lambda)	Pay-per-use

Weiterführende Artikel

Fazit

Webhooks sind fundamental für moderne Automatisierung:

Echtzeit-Verarbeitung statt Polling
Ressourcenschonend
Einfach zu implementieren mit n8n/Make.com

Häufige Fragen

Was ist der Unterschied zwischen einem Webhook und einer API?

Eine API wird aktiv abgefragt (Pull) -- Ihr System fragt regelmaessig nach neuen Daten. Ein Webhook sendet Daten automatisch bei einem Event (Push). Webhooks sind effizienter, weil sie nur dann Daten senden, wenn tatsaechlich etwas passiert.

Sind Webhooks sicher?

Ja, wenn korrekt implementiert. Best Practices sind: HTTPS verwenden, Webhook-Signaturen verifizieren, IP-Whitelisting einrichten und die empfangenen Daten vor der Verarbeitung validieren.

Was passiert, wenn mein Webhook-Endpunkt nicht erreichbar ist?

Die meisten Dienste haben Retry-Mechanismen. Fehlgeschlagene Webhooks werden automatisch mehrfach erneut gesendet. Sie sollten dennoch ein Monitoring einrichten, um Ausfaelle schnell zu erkennen.

Kann ich Webhooks ohne Programmierkenntnisse nutzen?

Ja, Tools wie Make.com und n8n bieten Webhook-Trigger als No-Code Module an. Sie erhalten eine URL, die Sie im Quellsystem hinterlegen -- den Rest erledigt das Tool visuell.

Wie teste ich einen Webhook?

Nutzen Sie Tools wie webhook.site oder RequestBin, um Webhook-Payloads zu inspizieren. In Make.com und n8n koennen Sie Webhooks im Test-Modus ausfuehren und die eingehenden Daten direkt sehen.

Nächste Schritte

Webhook-Endpoint erstellen (n8n empfohlen)

Bei einem Service registrieren (z.B. Shopify, Stripe)

Signatur-Verifizierung implementieren

Fehlerbehandlung einbauen

Produktiv schalten

Wir unterstützen Sie bei der Webhook-Integration – von der Einrichtung bis zur Produktion.