First-Party Tracking mit Cloudflare Workers

Richten Sie einen First-Party-Proxy mit Cloudflare Workers ein. Diese Anleitung ist für Benutzer mit Shared Hosting (Hostinger, GoDaddy, Bluehost, etc.) gedacht, die keine serverseitigen Proxies einrichten können.

Bevor Sie beginnen

Stellen Sie sicher, dass Sie haben:

• Ein Cloudflare-Konto (die kostenlose Tier funktioniert perfekt) - Hier registrieren
• Ihre Domain zu Cloudflare hinzugefügt (siehe Schritt 2)
• Ihren Zenovay-Tracking-Code (zu finden unter Domains → your site → General)

Warum Cloudflare Workers?

Cloudflare Workers laufen auf Cloudflares globalem Edge-Netzwerk (300+ Rechenzentren). Das bedeutet:

• Schnell: Sub-50ms Antwortzeiten weltweit
• Kostenlos: 100.000 Anfragen/Tag im kostenlosen Plan (mehr als genug für die meisten Websites)
• Einfach: Kein Server zu verwalten
• Zuverlässig: 99,99% Verfügbarkeit

Schritt 1: Erstellen Sie ein Cloudflare-Konto

Wenn Sie bereits ein Cloudflare-Konto haben, fahren Sie mit Schritt 2 fort.

1. Gehen Sie zu cloudflare.com
2. Klicken Sie auf Sign Up (oben rechts)
3. Geben Sie Ihre E-Mail-Adresse ein
4. Erstellen Sie ein Passwort (mindestens 8 Zeichen)
5. Klicken Sie auf Create Account
6. Überprüfen Sie Ihre E-Mail und klicken Sie auf den Verifizierungslink

Schritt 2: Fügen Sie Ihre Domain zu Cloudflare hinzu

1. Melden Sie sich bei Ihrem Cloudflare-Dashboard an
2. Klicken Sie auf Add a Site (großer blauer Button)
3. Geben Sie Ihren Domainnamen ein (z. B. yourdomain.com)
   • Geben Sie nicht www. oder https:// ein
   • Nur die Domain: yourdomain.com
4. Klicken Sie auf Continue
5. Wählen Sie den Free-Plan und klicken Sie auf Continue
6. Cloudflare scannt Ihre vorhandenen DNS-Einträge - klicken Sie auf Continue
7. Cloudflare zeigt Ihnen zwei Nameserver wie:
   • bella.ns.cloudflare.com
   • troy.ns.cloudflare.com
8. Kopieren Sie diese Nameserver - Sie benötigen sie im nächsten Schritt

Aktualisieren Sie die Nameserver Ihrer Domain

Jetzt müssen Sie Ihre Domain auf Cloudflare verweisen:

1. Melden Sie sich bei Ihrer Domain-Registrierung an (wo Sie Ihre Domain gekauft haben):
   • GoDaddy: godaddy.com
   • Namecheap: namecheap.com
   • Google Domains: domains.google.com
   • Hostinger: hostinger.com
2. Finden Sie die DNS- oder Nameserver-Einstellungen Ihrer Domain
3. Ersetzen Sie die vorhandenen Nameserver mit Cloudflares Nameservern
4. Speichern Sie die Änderungen

Schritt 3: Erstellen Sie den Worker

1. Klicken Sie im Cloudflare-Dashboard-Seitenmenü auf Workers & Pages
2. Klicken Sie auf den blauen Create-Button
3. Klicken Sie auf Create Worker
4. Geben Sie Ihrem Worker einen Namen: zenovay-proxy
   • Verwenden Sie nur Kleinbuchstaben, Zahlen und Bindestriche
   • Keine Leerzeichen erlaubt
5. Klicken Sie auf Deploy

Sie sehen eine Erfolgsmeldung. Jetzt müssen wir den Proxy-Code hinzufügen.

Schritt 4: Fügen Sie den Proxy-Code hinzu

1. Klicken Sie nach der Bereitstellung auf Edit code (oder gehen Sie zu Ihrem Worker und klicken Sie auf "Edit code")
2. Sie sehen einen Code-Editor mit einigem Standardcode
3. Wählen Sie ALLE vorhandenen Code (Cmd+A auf Mac, Ctrl+A auf Windows)
4. Löschen Sie ihn (Drücken Sie Löschen oder Rücktaste)
5. Kopieren und fügen Sie den folgenden Code ein:

// Zenovay First-Party Proxy Worker
// This proxies tracking requests through your domain to bypass ad blockers

export default {
async fetch(request) {
  const url = new URL(request.url);

  // Get the real visitor IP address (for accurate geolocation)
  const clientIP = request.headers.get('CF-Connecting-IP') || '';

  // Determine the target URL based on the request path
  let targetUrl;
  if (url.pathname === '/script.js' || url.pathname === '/z.js') {
    // Script requests go to the regular endpoint
    targetUrl = `https://api.zenovay.com/z.js${url.search}`;
  } else {
    // All other requests (events, settings) go through first-party endpoint
    targetUrl = `https://api.zenovay.com/fp${url.pathname}${url.search}`;
  }

  // Copy the original request headers
  const headers = new Headers(request.headers);

  // IMPORTANT: Forward the real visitor IP for accurate geolocation
  headers.set('X-Zenovay-Real-IP', clientIP);

  // Remove the Host header (we're proxying to a different domain)
  headers.delete('Host');

  // Handle CORS preflight requests
  if (request.method === 'OPTIONS') {
    return new Response(null, {
      status: 204,
      headers: {
        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
        'Access-Control-Allow-Headers': 'Content-Type',
      },
    });
  }

  try {
    // Forward the request to Zenovay API
    const response = await fetch(targetUrl, {
      method: request.method,
      headers: headers,
      body: request.body,
    });

    // Add CORS headers to the response
    const responseHeaders = new Headers(response.headers);
    responseHeaders.set('Access-Control-Allow-Origin', '*');

    // Return the response to the visitor's browser
    return new Response(response.body, {
      status: response.status,
      headers: responseHeaders,
    });
  } catch (error) {
    // If something goes wrong, return an error
    return new Response(JSON.stringify({ error: 'Proxy error' }), {
      status: 502,
      headers: { 'Content-Type': 'application/json' },
    });
  }
}
}

6. Klicken Sie auf Save and Deploy (oben rechts)
7. Warten Sie auf die Meldung "Worker deployed successfully"

Schritt 5: Fügen Sie Ihre benutzerdefinierte Domain hinzu

Jetzt verbinden Sie Ihren Worker mit Ihrer Domain:

1. Gehen Sie zu Ihrem Worker im Cloudflare-Dashboard
2. Klicken Sie auf die Registerkarte Settings (nicht "Triggers" - es wurde zu Settings verschoben)
3. Scrollen Sie nach unten, um die Sektion Domains & Routes zu finden
4. Klicken Sie auf Add → Custom Domain
5. Geben Sie Ihre Subdomain ein: z.yourdomain.com
   • Ersetzen Sie yourdomain.com durch Ihre tatsächliche Domain
   • Behalten Sie das z. Präfix genau wie gezeigt bei
6. Klicken Sie auf Add Custom Domain
7. Cloudflare wird automatisch:
   • Einen DNS-Eintrag für z.yourdomain.com erstellen
   • Ein SSL-Zertifikat bereitstellen (HTTPS)
   • Dies dauert 1-2 Minuten

Schritt 6: Testen Sie Ihren Worker

Bevor Sie das Tracking-Skript hinzufügen, stellen Sie sicher, dass der Worker funktioniert:

1. Öffnen Sie eine neue Browser-Registerkarte
2. Gehen Sie zu: https://z.yourdomain.com/script.js
   • Ersetzen Sie yourdomain.com durch Ihre tatsächliche Domain
3. Sie sollten JavaScript-Code sehen (eine Menge minimierter Code)

Schritt 7: Fügen Sie das Tracking-Skript zu Ihrer Website hinzu

Fügen Sie diesen Code zum Abschnitt <head> Ihrer Website hinzu. Sie finden Ihren Tracking-Code unter Domains → your site → General in der Zenovay-App.

<script data-cfasync="false">
window.ZENOVAY_TRACKER_CONFIG = {
trackingCode: 'YOUR_TRACKING_CODE',
apiUrl: 'https://z.yourdomain.com',
settingsEndpoint: '/settings'
};
var script = document.createElement('script');
script.src = 'https://z.yourdomain.com/script.js';
script.defer = true;
document.head.appendChild(script);
</script>

Was Sie ersetzen müssen:

Beispiel mit echten Werten:

<script data-cfasync="false">
window.ZENOVAY_TRACKER_CONFIG = {
trackingCode: 'ZV_Q8U0GYD70WR',
apiUrl: 'https://z.mywebsite.com',
settingsEndpoint: '/settings'
};
var script = document.createElement('script');
script.src = 'https://z.mywebsite.com/script.js';
script.defer = true;
document.head.appendChild(script);
</script>

Wo fügen Sie diesen Code hinzu:

• WordPress: Verwenden Sie ein Plugin wie "Insert Headers and Footers" oder fügen Sie zu header.php Ihres Themes hinzu
• Wix: Settings → Custom Code → Head Code
• Squarespace: Settings → Advanced → Code Injection → Header
• Shopify: Online Store → Themes → Edit Code → theme.liquid (im Abschnitt <head>)
• HTML-Dateien: Zwischen den Tags <head> und </head>
• Beliebiges CMS: Suchen Sie nach "Custom Code" oder "Header Scripts" in Ihren Einstellungen

Schritt 8: Überprüfen Sie, ob es funktioniert

Überprüfung 1: Network-Registerkarte (beliebiger Browser)

1. Öffnen Sie Ihre Website in Chrome, Firefox oder Edge
2. Drücken Sie F12 (oder Cmd+Option+I auf Mac), um DevTools zu öffnen
3. Klicken Sie auf die Registerkarte Network
4. Aktualisieren Sie Ihre Website (Cmd+R oder Ctrl+R)
5. Geben Sie im Filter-/Suchfeld script.js ein
6. Suchen Sie nach einer Anfrage an z.yourdomain.com/script.js

Was Sie sehen sollten:

• Status: 200 (OK)
• Domain: z.yourdomain.com (Ihre Domain, nicht api.zenovay.com)

Überprüfung 2: Firefox Strict Mode (am wichtigsten!)

Firefox hat den strengsten Tracking-Schutz. Wenn es in Firefox funktioniert, funktioniert es überall.

1. Öffnen Sie den Firefox-Browser
2. Klicken Sie auf das Menü (☰) → Settings
3. Klicken Sie in der linken Seitenleiste auf Privacy & Security
4. Wählen Sie unter "Enhanced Tracking Protection" die Option Strict
5. Schließen Sie die Einstellungen und besuchen Sie Ihre Website
6. Öffnen Sie DevTools (F12) → Network-Registerkarte
7. Aktualisieren Sie die Seite
8. Suchen Sie nach script.js - es sollte mit Status 200 geladen werden

Überprüfung 3: Zenovay-Dashboard

1. Gehen Sie zu app.zenovay.com und melden Sie sich an
2. Klicken Sie auf Ihre Website
3. Besuchen Sie Ihre Website in einer anderen Registerkarte
4. Innerhalb von 1-2 Minuten sollte der Besuch in Ihrem Dashboard angezeigt werden

Abschließende Checkliste

Bevor Sie fertig sind, überprüfen Sie ALLE diese Punkte:

• Worker ist bei z.yourdomain.com bereitgestellt (antwortet mit JavaScript-Code)
• Benutzerdefinierte Domain verwendet z. Präfix (NICHT analytics., metrics. usw.)
• Script-Tag enthält das Attribut data-cfasync="false"
• window.ZENOVAY_TRACKER_CONFIG ist mit korrektem trackingCode gesetzt
• Beide URLs im Skript verwenden Ihre benutzerdefinierte Domain z.yourdomain.com
• Getestet in Firefox mit Enhanced Tracking Protection eingestellt auf Strict
• Besuche erscheinen im Zenovay-Dashboard

Fehlerbehebung

Worker gibt 522 oder 524 Fehler zurück

Ursache: Timeout beim Verbinden mit der Zenovay API.

Lösung:

1. Überprüfen Sie, dass api.zenovay.com erreichbar ist (besuchen Sie es in Ihrem Browser)
2. Überprüfen Sie, dass es keine Tippfehler im Proxy-Code gibt
3. Versuchen Sie, den Worker erneut bereitzustellen (Code bearbeiten → Save and Deploy)

Benutzerdefinierte Domain zeigt SSL-Fehler

Ursache: SSL-Zertifikat ist noch nicht bereitgestellt.

Lösung: Warten Sie 1-5 Minuten. Cloudflare stellt SSL-Zertifikate automatisch bereit. Wenn dies länger als 10 Minuten dauert, überprüfen Sie, dass die Nameserver Ihrer Domain korrekt auf Cloudflare verweisen.

Skript lädt aber keine Daten im Dashboard

Ursache: Normalerweise ein Tracking-Code-Mismatch.

Lösung:

1. Öffnen Sie die DevTools-Konsole Ihres Browsers (F12 → Console-Registerkarte)
2. Suchen Sie nach roten Fehlermeldungen
3. Überprüfen Sie, dass Ihr trackingCode genau dem in Ihrem Zenovay-Dashboard entspricht (Case-Sensitive!)
4. Stellen Sie sicher, dass die Website-Domain in Zenovay registriert ist

"Script executing" aber nichts geschieht

Ursache: Die apiUrl in Ihrer Konfiguration ist falsch.

Lösung: Stellen Sie sicher, dass Ihre window.ZENOVAY_TRACKER_CONFIG die richtige apiUrl hat:

apiUrl: 'https://z.yourdomain.com',  // Ihre tatsächliche benutzerdefinierte Domain

Geolocation zeigt falschen Standort

Ursache: Echte IP wird nicht an Zenovay weitergeleitet.

Lösung: Stellen Sie sicher, dass Ihr Worker-Code diese Zeile enthält:

headers.set('X-Zenovay-Real-IP', clientIP);

Firefox/Edge blockiert immer noch

Ursache: Sie verwenden eine blockierte Subdomain wie analytics.* oder metrics.*.

Lösung: Ändern Sie Ihre benutzerdefinierte Domain zu z.yourdomain.com. Sie müssen:

1. Gehen Sie zu Workers & Pages → Your Worker → Settings
2. Löschen Sie die alte benutzerdefinierte Domain
3. Fügen Sie eine neue benutzerdefinierte Domain hinzu: z.yourdomain.com
4. Aktualisieren Sie beide URLs in Ihrem Tracking-Skript

Erweitert: Mehrere Websites

Wenn Sie mehrere Websites haben, können Sie einen Worker für alle verwenden:

1. Fügen Sie mehrere benutzerdefinierte Domains zu demselben Worker hinzu:

   • z.website1.com
   • z.website2.com
   • z.website3.com

2. Jede Website verwendet ihren eigenen Tracking-Code:

<script data-cfasync="false">
window.ZENOVAY_TRACKER_CONFIG = {
  trackingCode: 'ZV_SITE1CODE',
  apiUrl: 'https://z.website1.com',
  settingsEndpoint: '/settings'
};
var s = document.createElement('script');
s.src = 'https://z.website1.com/script.js';
s.defer = true;
document.head.appendChild(s);
</script>

<script data-cfasync="false">
window.ZENOVAY_TRACKER_CONFIG = {
  trackingCode: 'ZV_SITE2CODE',
  apiUrl: 'https://z.website2.com',
  settingsEndpoint: '/settings'
};
var s = document.createElement('script');
s.src = 'https://z.website2.com/script.js';
s.defer = true;
document.head.appendChild(s);
</script>

Nächste Schritte

• Custom Events - Verfolgen Sie Schaltflächen-Klicks und Formularübermittlungen
• Visitor Identification - Verbinden Sie Analytics mit Benutzerkonten
• Fehlerbehebung - Weitere Hilfe bei häufigen Problemen

Benötigen Sie Hilfe?

Wenn Sie feststecken:

1. Überprüfen Sie jeden Schritt oben doppelt
2. Stellen Sie sicher, dass Sie z.yourdomain.com verwenden (nicht analytics.* oder metrics.*)
3. Testen Sie im Firefox Strict Mode
4. Überprüfen Sie die Browser-Konsole auf Fehler (F12 → Console-Registerkarte)

Immer noch feststecken? Kontaktieren Sie [email protected] mit:

• Ihrem Domain-Namen
• Screenshot der Network-Registerkarte
• Eventuellen Fehlermeldungen aus der Console-Registerkarte