→ dash.cloudflare.com/sign-up — Email + Passwort reicht, kein Plan nötig, gratis.
🔌 Cloudflare Worker Setup
Der HERO API-Server ist hinter Cloudflare WAF geschützt und blockt direkte Browser-Anfragen. Ein eigener Cloudflare Worker löst das in 5 Minuten — kostenlos, kein eigener Server nötig.
Warum ein Worker?
Postman schickt WAF-Session-Cookies mit (
Postman schickt WAF-Session-Cookies mit (
CLOUDWAFSESID,
CLOUDWAFSESTIME, _LB),
die Cloudflare ausgestellt hat. Browsers dürfen solche Cookies bei Cross-Origin-Requests
nicht mitschicken (Fetch-Spec, verboten). Ein Cloudflare Worker läuft als Server —
er ruft HERO direkt auf, ohne WAF-Cookie-Anforderung, und gibt die Antwort
mit CORS-Headern an den Browser zurück.
1
Cloudflare Account
Kostenlos, keine Kreditkarte, 2 Minuten
Account erstellen (falls noch nicht vorhanden)
Falls du schon einen Account hast
Direkt zu Schritt 2 gehen. Kein Domain nötig.
Cloudflare Workers Free Tier: 100.000 Requests pro Tag — für
Sky-Frame Nutzung mehr als ausreichend. Kein Upgrade nötig.
2
Worker erstellen
Im Cloudflare Dashboard — 3 Klicks
Im Cloudflare Dashboard navigieren
Workers & Pages
→
Create Application
→
Create Worker
📺 So sieht das aus:
Cloudflare Dashboard
├── [linke Sidebar]
│ ├── Home
│ ├── Domains & DNS
│ ├── ► Workers & Pages ← hier klicken
│ └── ...
│
[Nach Klick: Workers & Pages Übersicht]
│
├── Create Application ← klicken
│
[Modal: "What would you like to build?"]
├── ○ Pages
└── ● Workers ← auswählen
└── Create Worker ← klicken
Name eingeben
Im Feld "Name your Worker" tippen: hero-proxy
Dann Deploy klicken — der Code spielt noch keine Rolle, wird gleich ersetzt.
3
Worker-Code einfügen
Code kopieren → im CF Editor einfügen → deployen
Im CF Dashboard: "Edit Code" klicken
Nach dem ersten Deploy erscheint die Worker-Übersicht. Klicke auf Edit Code (oder "Quick Edit").
Worker Übersicht
→
Edit Code
→
Editor öffnet sich
Alten Code komplett löschen
Im Editor: Ctrl+A (alles markieren) dann Delete
Diesen Code einfügen:
cloudflare-worker/hero-proxy.js
Save and Deploy klicken
Oben rechts im Editor: Save and Deploy
✓ "Your worker has been deployed" = Erfolg
Falls der Editor "Module syntax not supported" meldet:
Oben im Editor auf "Workers" → "Module Worker" umschalten.
Der Code verwendet
export default {} (ES Modules Syntax).4
Worker-URL kopieren
Die URL die Cloudflare für deinen Worker erstellt hat
Wo findest du die URL?
Nach dem Deploy erscheint sie direkt im Editor oben, und auch auf der Worker-Übersichtsseite:
📺 Worker-URL Position:
[Worker Übersicht — nach Deploy]
Name: hero-proxy
Status: ✅ Active
Preview URL:
https://hero-proxy.DEIN-NAME.workers.dev
[Edit Code] [Settings]
URL hier einfügen (zur Kontrolle):
5
URL in Settings eintragen
settings.html → CF Worker Proxy-URL → Speichern
Settings öffnen und URL eintragen
settings.html
→
HERO API Verbindung
→
CF Worker Proxy-URL
📺 Feld in settings.html:
HERO API Verbindung
─────────────────────────────────────
API Endpunkt: https://login.hero-software.de/api/...
Bearer Token: ••••••••••••••••••••••••
CF Worker Proxy-URL:
https://hero-proxy.DEIN-NAME.workers.dev ← HIER
[⚡ Verbindung testen] ● Nicht getestet
6
Verbindung testen
Settings → "Verbindung testen" → grüne Bestätigung
In settings.html: "Verbindung testen" klicken
Der Button testet automatisch: erst Direktverbindung (erwartet: fehlschlägt) → dann CF Worker → zeigt grüne Bestätigung.
📺 Erwartetes Ergebnis:
[Nach Klick auf "Verbindung testen"]
Schritt 1/3: Direktverbindung… ✗ (Cloudflare WAF)
Schritt 2/3: Cloudflare Worker… ✓
┌─────────────────────────────────────────────────────┐
│ ✓ Verbunden via Cloudflare Worker │
│ CF Worker antwortet korrekt (142ms). │
│ Alle API-Calls laufen über: │
│ https://hero-proxy.DEIN-NAME.workers.dev │
└─────────────────────────────────────────────────────┘
● ✓ Worker OK (142ms)
Falls immer noch rot: hero-test.html öffnen → Abschnitt ⑤ →
Worker-URL eintragen → testen. Das Diagnose-Tool zeigt den genauen Fehler.