Cookie-Einwilligung für Lovable

Cookie-Einwilligung für Lovable,
mit einem Prompt

Lovable baut die App und das Tracking, das Sie verlangt haben, und fügt keinen Einwilligungsschritt hinzu. Bitten Sie es um ein Banner, bekommen Sie eine Box, die eine Auswahl zeigt und nichts blockiert. Diese Seite behebt beides in zehn Minuten.

Die ganze Änderung: die Runtime zuerst, und jeder Tracker wird zu einem Skript, das auf seine Kategorie wartet.

die Regel

Was Lovable weglässt

Ein Standard-Lovable-Projekt setzt Analyse- und Marketing-Cookies, sobald diese Skripte hinzugefügt werden. Genau dieses Verhalten ahnden europäische Aufsichtsbehörden, und die rechtliche Pflicht liegt bei Ihnen, dem Betreiber, nicht beim Werkzeug, das den Code erzeugt hat.

Die Regel ist überall in der EU und im Vereinigten Königreich dieselbe: Ohne Zustimmung darf nichts über das unbedingt Notwendige hinaus auf dem Gerät eines Besuchers gespeichert oder von dort ausgelesen werden. Das ist Artikel 5 Absatz 3 der ePrivacy-Richtlinie, und die Zustimmung muss der DSGVO-Definition von Einwilligung genügen: freiwillig, spezifisch, informiert und unmissverständlich, mit einer Ablehnung, die so einfach ist wie die Annahme. Das Vereinigte Königreich hält dieselbe Regel in PECR fest, mit engen Ausnahmen für risikoarme Statistiken seit dem 5. Februar 2026. Kalifornien und die anderen US-Bundesstaaten funktionieren umgekehrt: kein Opt-in, aber ein Opt-out-Link und Unterstützung für das Global-Privacy-Control-Signal.

Für eine Website folgen daraus drei Dinge. Analyse-, Werbe- und Social-Media-Skripte müssen auf eine Entscheidung warten. Die Entscheidung muss so aufgezeichnet werden, dass Sie sie später vorzeigen können, denn Artikel 7 Absatz 1 legt die Beweislast bei Ihnen. Und der Widerruf muss so einfach sein wie die Zustimmung, also braucht es auf jeder Seite ein Bedienelement, das das Banner wieder öffnet. Ein Banner, das zwei Buttons zeigt und Google Analytics trotzdem lädt, fällt beim ersten Test durch, und genau dieses Versagen ahnden die Aufsichtsbehörden, von den CNIL-Entscheidungen gegen Google und SHEIN bis zu den Prüfwellen der niederländischen und belgischen Behörden.

so funktioniert es

So funktioniert Einwilligung in einer Lovable-App

Lovable erzeugt eine React-App auf Vite mit Tailwind und shadcn/ui, meist mit Supabase dahinter, und veröffentlicht sie auf einer lovable.app-Subdomain oder Ihrer eigenen Domain. Die Consent-Runtime gehört in die eine Datei, die jede Vite-App hat: index.html, als erstes im Head. Lovable bearbeitet diese Datei, wenn Sie es darum bitten, und behält die Änderung über spätere Prompts hinweg.

Was Lovable von sich aus nicht tut, ist blockieren. Bitten Sie um „ein Cookie-Banner“, schreibt das Modell eine Komponente, die zwei Buttons zeigt und einen Boolean speichert, während das zuvor eingefügte Google-Analytics- oder Meta-Pixel-Snippet bei jedem Seitenaufruf weiterläuft. Das ist schlimmer als kein Banner: Es sieht konform aus und ist es nicht. Der Prompt unten tut die zwei Dinge, die zählen, in der richtigen Reihenfolge: zuerst die Runtime, dann jeden Tracker zu einem einwilligungspflichtigen Skript machen.

Danach übernimmt der Scanner. Er lädt Ihre veröffentlichte App in einem echten Browser, in jedem Einwilligungszustand, und listet auf, was noch vor der Einwilligung feuert, falls überhaupt. Da Lovable-Apps Single-Page-Apps sind, folgt der Scan den clientseitigen Routen, die er im gerenderten DOM entdeckt; fügen Sie im Dashboard Start-URLs für Routen hinzu, die er von der Startseite nicht erreicht. Das Einwilligungsprotokoll zeichnet jede Entscheidung auf, sobald das Banner live ist.

Einrichtung

Einrichtung aus Lovable

Zehn Minuten, ein Prompt, kein npm.

  1. Website anlegen, Schlüssel holen

    Registrieren, die Domain hinzufügen, unter der Ihre App veröffentlicht ist, und den Produktionsschlüssel unter Installation kopieren. Der kostenlose Tarif deckt zwei Domains ab.

  2. Diesen Prompt in Lovable einfügen

    Er setzt das Tag an erste Stelle und macht jeden Tracker zu einem einwilligungspflichtigen Skript. Lesen Sie das Diff, das er erzeugt; sonst sollte sich nichts ändern.

    Add this script tag as the very first element inside <head> of index.html:
    <script src="https://app.cookiecrumbs.eu/runtime/cc.js"
            data-cc-site="pk_live_…"
            data-cc-env="production"></script>
    Then change every analytics, advertising and social script (Google Analytics, gtag, Meta Pixel, TikTok, Hotjar, HubSpot) to type="text/plain" and add data-cc-category="analytics" or data-cc-category="marketing" to each one. Do not change anything else.
  3. Veröffentlichen, dann scannen

    Veröffentlichen Sie die App. Starten Sie im Dashboard den ersten Scan: Er lädt die Live-App in einem echten Browser und listet auf, was noch vor der Einwilligung feuert, falls überhaupt.

  4. Einmal einsortieren, rechtliche Links setzen, Banner veröffentlichen

    Sortieren Sie jeden Anbieter unter eine Kategorie, setzen Sie Impressum- und Datenschutz-Links, veröffentlichen Sie. Das Banner ist live, und das Einwilligungsprotokoll zeichnet auf.

  5. Installations-Check ausführen

    Er lädt Ihre Seite wie ein Besucher und bestätigt, dass das Banner vor jedem Tracker lief. Dieses Häkchen ist der Nachweis.

aufgepasst

Fehler, die wir bei Lovable sehen

Jeder davon taucht im ersten Scan als Tracker auf, der vor der Einwilligung gefeuert hat.

  • Lovable um „eine Cookie-Banner-Komponente“ bittenSie bekommen UI, keine Blockierung. Die zuvor eingefügten Skripte laufen beim Laden weiter.
  • Analyse über eine Lovable-Integration hinzugefügtEin vom Builder eingefügtes GA4- oder Pixel-Snippet sitzt in index.html oder main.tsx und feuert beim Laden. Es braucht die text/plain-Behandlung wie jedes andere.
  • Supabase-Auth-Cookies als Marketing einsortiertSession-Cookies für die Anmeldung sind unbedingt notwendig. Sortieren Sie sie unter notwendig ein, damit das Banner nicht Ihren eigenen Login sperrt.
  • Nur auf der lovable.app-Vorschau testenNutzen Sie dort den Preview-Schlüssel und den Produktionsschlüssel auf Ihrer eigenen Domain. Scan und Installations-Check brauchen die Live-URL.
  • Keine Links zu Datenschutzerklärung und ImpressumDas Banner muss auf beide verlinken, und die Veröffentlichung wird verweigert, bis sie gesetzt sind. Lovable schreibt diese Seiten nicht; das tun Sie.

vor dem Livegang

Die Compliance-Checkliste

Acht Zeilen. Die letzten beiden hakt das Dashboard anhand echter Daten ab.

  • Das Tag ist das erste Skript im HeadAlles darüber kann ein Cookie setzen, das die Runtime nicht zurücknehmen kann.
  • Jedes Analyse-, Werbe- und Social-Skript wartet auf seine KategorieEntweder type="text/plain" mit einer Kategorie, oder der Host steht in der Block-Map aus dem Scan.
  • „Alle ablehnen“ steht auf der ersten EbeneGleiche Größe, gleiches Gewicht wie „Alle akzeptieren“. Kein „X“, das als Einwilligung zählt, keine vorangekreuzten Kästchen.
  • Die Consent-Mode-Standardwerte stehen auf „denied“, bevor Google lädtPrüfen Sie die sieben Signale im Tag Assistant bei verweigerter Einwilligung.
  • Die Links zu Impressum und Datenschutzerklärung sind gesetztOhne beide wird die Veröffentlichung verweigert; die Banner-Fußzeile verlinkt darauf.
  • Ein Widerrufs-Element ist auf jeder Seite erreichbarDas dauerhafte Bedienelement oder ein Link „Cookies verwalten“ in Ihrer Fußzeile.
  • Der erste vollständige Scan ist gelaufen und jeder Anbieter ist einsortiertDas Urteil auf der Startseite sagt datiert, was vor der Einwilligung gefeuert hat.
  • Der Installations-Check ist bestandenEr lädt Ihre Seite wie ein Besucher und bestätigt, dass das Banner vor jedem Tracker lief.

was Sie bekommen

Was der kostenlose Tarif enthält

Zwei Domains, 100 gescannte Unterseiten pro Monat und Domain, jede Regulierung, die CLI, die SDKs und der MCP-Server.

Ein Scanner, der die gerenderte Seite liest

Jede Seite, in jedem Einwilligungszustand, in einem echten Browser. Cookies, Pixel, iFrames und Storage-Schlüssel, mit der Seite und dem Skript, die sie gesetzt haben. Regelmäßig neu gescannt.

Die Cookie-Erklärung schreibt sich aus dem Ergebnis von selbst.

Ein Banner, das zuerst blockiert

Tags bleiben inaktiv, bis ihre Kategorie erlaubt wird. „Alle ablehnen“ ist so sichtbar wie „Alle akzeptieren“. Sieben Layouts, 25 Sprachen, Consent Mode v2 und die richtige Regel pro Region.

21 kB, eine Datei, keine eigenen Anfragen an Dritte.

Ein Nachweis, den Sie vorlegen können

Jede Entscheidung wird mit Zeitstempel, Banner-Version und einem Hash der angezeigten Texte gespeichert, verkettet mit dem Datensatz davor. Exporte sind signiert. Gehostet in Frankfurt.

Artikel 7 Absatz 1, im kostenlosen Tarif.

kostenloser Check

Sehen Sie, was Ihre Lovable-App gerade lädt

Das HTML der Startseite, abgeglichen mit der Tracker-Datenbank. Kein Konto, nichts wird gespeichert. Der vollständige Scan im Dashboard macht dasselbe für jede Seite, in einem echten Browser.

Fragen

Klare Antworten

Fügt Lovable standardmäßig ein DSGVO-Cookie-Banner hinzu?
Nein. Lovable erzeugt die Analyse- und Pixel-Skripte, die Sie anfordern, und nichts, das den Besucher vorher fragt. Bittet man es um ein Banner, entsteht meist eine kosmetische Box, die eine Auswahl zeigt und nichts blockiert.
Kann ich CookieCrumbs hinzufügen, ohne Lovable zu verlassen?
Ja. Fügen Sie den Prompt von dieser Seite in den Lovable-Chat ein. Er setzt das Tag als erstes in index.html und macht die Tracker zu einwilligungspflichtigen Skripten. Registrierung und Scan passieren im CookieCrumbs-Dashboard.
Ist ein Cookie-Banner für eine kleine App Pflicht?
Wenn die App Besucher in der EU oder im Vereinigten Königreich bedient und irgendein nicht notwendiges Cookie setzt, Analyse eingeschlossen, dann ja. Die Pflicht liegt beim Betreiber der Website, nicht beim Werkzeug, das sie erzeugt hat. Ein Hobbyprojekt ohne Analyse und ohne Embeds braucht nichts.
Macht das Banner die App langsamer?
Die Runtime ist 21 kB gzip, eine Datei, asynchron geladen, ohne eigene Anfragen an Dritte. Die Layouts Bar und Ribbon reservieren ihren Platz vor dem Rendern, also keine Layoutverschiebung.
Kann ich den Builder danach weiter nutzen?
Ja. Das Tag und die gesperrten Skripte sind gewöhnliches HTML, das Lovable zwischen Bearbeitungen erhält. Führen Sie den Scan nach großen Änderungen erneut aus; das Dashboard warnt Sie, wenn ein neuer Tracker auftaucht.
Wohin gehen die Einwilligungsdaten?
Nach Frankfurt, Deutschland. Datensätze verlassen die EU nie, neben einem Datensatz wird weder IP-Adresse noch User-Agent gespeichert, und jeder Datensatz exportiert sich als signiertes CSV oder JSON, auch nach der Kündigung.

nächster Schritt

Konform, bevor Sie den Link teilen

Kostenloser Tarif, zwei Domains, keine Karte. Scannen Sie zuerst die Live-App, wenn Sie sehen wollen, was sie heute lädt.