# Gewinnspiel-Generator für Shops Gestalte Glücksrad, Rubbellos oder Überraschungsbox zum Selbsthosten. Lokale Demo oder Shop-API, keine gehostete Preisvergabe. > Kanonische Seite: https://elysiatools.com/de/tools/store-promotion-giveaway-widget-generator - **Kategorie:** Design - **Schlagwörter:** Gewinnspiel-Generator für Shops, Glücksrad, Rubbellos, Überraschungsboxen ## Überblick ## Kampagnenstudio Gestalte Glücksrad, Rubbellos oder Überraschungsbox zum Selbsthosten. Lokale Demo oder Shop-API, keine gehostete Preisvergabe. - Komponente: Glücksrad / Rubbellos / Überraschungsboxen - Thema: Küstenminimalismus / Bonbon-Pop / Retro-Arcade / Mitternachtsgold / Festpapier / Gartenskizze ### Ergebnisquelle Lokale Ziehungen sind veränderbare Demos, keine sichere Preisvergabe. Angebote im Code sind öffentlich. Kein Bestands-, Identitäts- oder Mehrfachschutz. Dein Server verwaltet Authentifizierung, Chancen, Bestand, Teilnahme und Idempotenz. Keine geheimen Schlüssel eingeben. Die Vorschau ruft die API nie auf. ### Anleitung zur API-Anbindung Dies ist eine Schnittstellenvorgabe, kein Elysia-Ziehungsdienst. Implementiere POST /api/draw auf deinem Server mit denselben Kampagnen- und Preis-IDs und trage den Endpunkt ein. Lade die Dateien herunter und hoste sie auf HTTPS für echte Tests; der Editor simuliert nur. #### Anfrage · POST application/json Das Widget sendet nur version, campaignId und eine zufällige 32-stellige hexadezimale requestId. Keine Kunden-ID, Chancen oder API-Schlüssel. Der Server muss Teilnehmer selbst identifizieren; requestId ist kein Anmeldenachweis. ```json { "version": 1, "campaignId": "summer-boutique", "requestId": "0123456789abcdef0123456789abcdef" } ``` #### Erfolg · 200 application/json Gib requestId unverändert zurück. prizeId muss konfiguriert sein, auch bei Nieten. Optional: receiptId (≤200 Zeichen), claim.code (≤300), claim.url (HTTPS, ≤2048). Ungenutzte Felder weglassen, nicht null senden. Keine data/result-Hülle; höchstens 16 KiB. Ein Fehler ist kein verlorenes Los. ```json { "requestId": "0123456789abcdef0123456789abcdef", "prizeId": "p1", "receiptId": "draw_2026_001", "claim": { "code": "SAMPLE-ONLY", "url": "https://shop.example/redeem" } } ``` Konfigurierte Preis-IDs: - `p1`: 10 % Rabatt - `p2`: Gratisversand - `p3`: Überraschung - `p4`: Vielleicht nächstes Mal Hoste Widget und /api/draw möglichst auf derselben Origin (Protokoll, Host, Port), nötigenfalls mit Reverse Proxy. Relative Pfade beziehen sich auf das Widget, nicht auf die Shop-Elternseite. credentials: same-origin sendet nur gleichursprüngliche Cookies. Authorization und eigene Header sind nicht konfigurierbar. Andere Origins benötigen CORS für das Widget und OPTIONS für POST + Content-Type; fremde Cookies werden nicht gesendet. Statisches HTML allein reicht nicht für authentifizierte Ziehungen; iframe-Cookies können blockiert werden. Der Server prüft Identität, Origin/CSRF und Teilnahme, begrenzt Versuche und Anfragen, zieht mit eigenen Chancen und speichert Bestand und Ergebnis in einer Transaktion. Speichere Idempotenz nach Teilnehmer + campaignId + requestId und liefere bei Wiederholung dasselbe Ergebnis. Einlösung und Ablauf serverseitig prüfen. Browserdaten beweisen keinen Anspruch; keine Geheimnisse veröffentlichen. Lehne Anfragen mit passendem Nicht-2xx-Status ab (z. B. 401/403/409/429/503). Das Widget zeigt eine allgemeine Meldung, nicht den Serverfehler. Nach 15 Sekunden wird abgebrochen; Redirects, ungültiges JSON, falsche requestId, unbekannte Preise und unsichere Links werden abgelehnt. Manuelles Wiederholen behält die ID nur auf dieser Seite; Neuladen erzeugt eine neue. Limits müssen dauerhaft gespeichert sein. Kein automatischer Retry oder lokaler Ersatzpreis. Die Offline-Vorschau bleibt bei unvollständigen API- oder Hosting-Feldern aktiv. Ergänze markierte Felder zum Export; bei Preis- oder Stilfehlern bleibt die letzte gültige Vorschau. ### Export und Einbettung HTML / CSS / JavaScript / JSON. Hoste die Dateien auf deiner HTTPS-Seite und füge die URL ein. Dieses Tool veröffentlicht oder hostet keine Kampagnen. Optionale Bilder laden im Browser von ihren HTTPS-Hosts. Der Editor speichert keine Bilder oder API-Schlüssel. Gleich große Segmente sind nur Darstellung; die Demo nutzt die angegebenen Chancen. Im API-Modus entscheidet der Server. ## Eingaben - **JSON-Konfiguration** (textarea) ## Wann verwenden - Wenn eine interaktive Rabatt-Aktion per Glücksrad, Rubbellos oder Boxenauswahl im Onlineshop eingebunden werden soll. - Wenn Gewinnchancen, Gutschein-Bestände und Teilnahmebeschränkungen über eine eigene Shop-API serverseitig gesteuert werden müssen. - Wenn für Marketing-Demos ein vollständig autarkes, clientseitiges Ziehungs-Widget ohne externe Abhängigkeiten benötigt wird. ## Funktionsweise - Das Design, der Spieltyp (Glücksrad, Rubbellos, Überraschungsboxen) und die Preisstruktur werden im Konfigurations-JSON definiert. - Im lokalen Modus wertet das Skript die hinterlegten Prozentwerte direkt im Browser aus; im API-Modus sendet das Widget eine standardisierte POST-Anfrage an den eigenen Server. - Nach der Validierung generiert das Tool den einsatzbereiten Code aus HTML, CSS, JavaScript und JSON zum Herunterladen und Einbinden auf dem eigenen HTTPS-Webserver. ## Anwendungsfälle - Erstellung eines saisonalen Glücksrads zur Vergabe von Aktions-Rabattcodes im Checkout-Prozess. - Einbindung eines Rubbelloses mit serverseitiger Validierung zur Verhinderung von Mehrfachteilnahmen bei Newsletter-Kampagnen. - Bereitstellung einer schnellen Klick-Demo mit Überraschungsboxen zur internen Präsentation von Shop-Aktionen. ## Häufig gestellte Fragen ### Verwaltet das Tool Gewinnchancen oder Gutscheincodes serverseitig? Nein, das Tool hostet keine Ziehungsdienste; für verbindliche Gewinnspiele muss ein eigener Endpunkt (POST /api/draw) betrieben werden. ### Sind lokale Ziehungen vor Manipulationen im Browser geschützt? Nein, lokale Demos werten Preise clientseitig aus und bieten keinen Schutz vor Mehrfachteilnahmen, Code-Einsehbarkeit oder Manipulation. ### Welche Daten sendet das Widget im API-Modus an meinen Server? Das Widget überträgt per JSON ausschließlich die Versionsnummer, die campaignId sowie eine zufällige 32-stellige requestId. ### Können eigene Authentifizierungs-Header konfiguriert werden? Nein, Anfragen nutzen same-origin Credentials; benutzerdefinierte HTTP-Header oder Authorization-Header werden nicht unterstützt. ### Welche Komponenten-Typen stehen zur Verfügung? Es stehen drei visuelle Spieltypen zur Auswahl: Glücksrad (wheel), Rubbellos (scratch) und Überraschungsboxen (boxes). ## Ähnliche Tools - [Color-Token-Kaskaden-Generator](https://elysiatools.com/de/tools/color-token-cascade-generator): Erzeugt aus einem Primaer-Hex eine komplette Token-Hierarchie mit CSS-Variablen und Style-Dictionary-JSON - [Bild-Palette zu Design-Tokens](https://elysiatools.com/de/tools/image-to-design-tokens): Extrahiert dominante Farben per k-Means und exportiert sie als CSS-/SCSS-Variablen, Tailwind-Config oder JSON-Tokens mit Namen und Farbskala - [API-Request-Code-Snippet-Generator](https://elysiatools.com/de/tools/api-request-code-snippet-generator): Erzeugt cURL- und gaengige Sprach-Snippets aus URL, Methode, Headern, Query-Parametern und Body - [CSV-zu-Datenbank-Migrationsplaner](https://elysiatools.com/de/tools/csv-to-database-migration-planner): Leitet aus CSV-Daten ein relationales Schema ab und erzeugt CREATE-TABLE- und ALTER-Plaene fuer PostgreSQL, MySQL, SQLite oder SQL Server - [Fitness-Workout-PDF-Generator](https://elysiatools.com/de/tools/fitness-workout-pdf-generator): Erstellt einen druckbaren Trainingsplan als PDF aus JSON oder CSV mit Tabellen, Fortschrittsfeldern und optionalen QR-Codes - [GitHub-Profil-README-Studio](https://elysiatools.com/de/tools/github-profile-readme-studio): Erzeuge ein vollständiges GitHub-Profil-README — Banner, Statistik-Kacheln, Heatmap, 3D-Skyline und Projektkarten — einmalig gebacken in statische, themenbare SVG-Assets. Keine Badge-Dienste, die ausfallen können. - [OpenAPI zu Postman Collection](https://elysiatools.com/de/tools/openapi-to-postman-collection): Wandelt eine OpenAPI-3.x- oder Swagger-2.0-Spec (JSON/YAML) in eine importierbare Postman Collection v2.1.0 mit Ordnern, Variablen, Auth und Beispielantworten. - [OpenAPI-zu-TypeScript-Generator](https://elysiatools.com/de/tools/openapi-to-typescript-generator): Konvertiert OpenAPI- oder Swagger-Spezifikationen in JSON/YAML in TypeScript-API-Typen, Anfrageparameter und Antwortmodelle mit konfigurierbarem Ausgabeformat und Namensstil ## Beispiele - [Distributed Tracing Beispiele](https://elysiatools.com/de/samples/distributed-tracing-samples): Umfassende Beispiele für verteiltes Tracing mit Jaeger, OpenTelemetry und modernen Observability Tools - [AWS EventBridge Beispiele](https://elysiatools.com/de/samples/eventbridge-samples): AWS EventBridge Beispiele einschließlich Event Buses, Rules, Targets, Schema Registry, Custom Events und Cross-Account Event Routing für Serverless Event-Driven Architecture - [JWT-Beispiele](https://elysiatools.com/de/samples/jwt-samples): Umfassende JWT-Beispiele von der grundlegenden Token-Struktur bis zu fortgeschrittenen Sicherheitsimplementierungen - [PDF-Beispiele](https://elysiatools.com/de/samples/pdf-samples): Generierte PDF-Beispiele von Tools zwischen 2026-02-01 und 2026-02-10 ## Verwandte Inhalte - [Selbst gehostetes Gewinnspiel-Widget prüfen und zur Einbettung übergeben](https://elysiatools.com/de/hubs/self-hosted-giveaway-widget-review-and-embed-handoff): Konfiguration, API-Beispiele, Lesbarkeit und responsive Ansichten prüfen und die Widget-Dateien mit nachvollziehbaren Browser-Abnahmetests übergeben.