So blockieren Sie Drittanbieter-Skripte bis zur Einwilligung

Um Drittanbieter-Skripte bis zur Einwilligung zu blockieren, liefern Sie sie in einer Form aus, die der Browser nicht ausführt, etwa als <script>-Tag mit type="text/plain", und aktivieren sie erst, nachdem der Besucher in die passende Kategorie eingewilligt hat. Wenden Sie dieselbe Regel auf Inline-Snippets, iframes, Tracking-Pixel und Tags im Tag-Manager an und prüfen Sie das Ganze dann in einem sauberen Browser, bevor Sie irgendetwas anklicken.

Warum müssen Drittanbieter-Skripte auf die Einwilligung warten?

Weil die meisten von ihnen in dem Moment, in dem sie laufen, Informationen auf dem Endgerät des Besuchers speichern oder auslesen, und das erfordert in der EU eine vorherige Einwilligung. Artikel 5 Absatz 3 der ePrivacy-Richtlinie verlangt eine Einwilligung für das Speichern von oder den Zugriff auf Informationen auf einem Endgerät, sofern dies nicht unbedingt erforderlich ist, um einen vom Nutzer ausdrücklich gewünschten Dienst bereitzustellen.

Analyse-, Werbe-, Social-Media- und viele Embed-Skripte setzen Cookies, lesen den Browserspeicher aus oder erfassen Gerätemerkmale, sobald sie ausgeführt werden. Im Fall Planet49 (C-673/17) hat der Gerichtshof der EU bestätigt, dass die Regel unabhängig davon gilt, ob es sich um personenbezogene Daten handelt, und dass vorab angekreuzte Kästchen keine wirksame Einwilligung darstellen. Ein Banner, der erscheint, während bereits Tracker laufen, erfüllt diesen Maßstab nicht.

Skripte, die für den Dienst tatsächlich benötigt werden, etwa für Zahlungen, Betrugsprävention oder das Consent-Tool selbst, können normal geladen werden; siehe was als unbedingt erforderliches Cookie gilt.

Wie blockiere ich Skripte vor der Einwilligung?

Ändern Sie ihren type. Browser laden und führen nur Skripte aus, deren type ein JavaScript-Typ oder module ist; ein als text/plain gekennzeichnetes Skript wird als inaktive Daten behandelt. Behalten Sie die ursprünglichen Attribute bei und ergänzen Sie eine Kategorie, damit Ihr Consent-Code weiß, was er aktivieren soll.

<!-- Inaktiv: Der Browser lädt diese Skripte weder herunter noch führt er sie aus -->
<script type="text/plain" data-consent="analytics"
        src="https://analytics.example.com/script.js"></script>

<script type="text/plain" data-consent="marketing">
  window.adPixel = window.adPixel || [];
  window.adPixel.push(['init', 'PIXEL_ID']);
</script>

<!-- Embeds: Die echte URL bis zur Einwilligung in data-src belassen -->
<iframe data-consent="marketing"
        data-src="https://www.youtube-nocookie.com/embed/VIDEO_ID"
        title="Produktdemo" width="560" height="315"></iframe>

Entfernen Sie die <noscript>-Bild-Fallbacks, die viele Anbieter-Snippets enthalten. Sie lösen einen Request aus, wenn JavaScript deaktiviert ist, also genau dann, wenn Ihr Banner nicht erscheinen kann. Es gibt daher keine Möglichkeit, sie abzusichern.

Wie aktiviere ich blockierte Skripte nach der Einwilligung?

Ersetzen Sie jedes inaktive Skript durch ein neues <script>-Element. Wenn Sie das type-Attribut eines bestehenden Elements ändern, führt der Browser es nicht aus, und Skripte, die über innerHTML eingefügt werden, laufen nie. Sie brauchen also ein neues Element, das mit document.createElement erzeugt wird.

function activate(category) {
  document
    .querySelectorAll(`script[type="text/plain"][data-consent="${category}"]`)
    .forEach((inert) => {
      const live = document.createElement('script');
      for (const { name, value } of inert.attributes) {
        if (name !== 'type') live.setAttribute(name, value);
      }
      if (!inert.hasAttribute('async')) live.async = false; // Einfügereihenfolge beibehalten
      live.text = inert.text; // ggf. Inline-Code
      inert.replaceWith(live);
    });

  document
    .querySelectorAll(`iframe[data-consent="${category}"][data-src]`)
    .forEach((frame) => { frame.src = frame.dataset.src; });
}

// Gespeicherte Entscheidung beim Laden anwenden; activate() erneut aus den Handlern Ihres Banners aufrufen.
for (const [category, granted] of Object.entries(readStoredConsent())) {
  if (granted) activate(category);
}

An drei Details scheitern viele:

• Reihenfolge. Per JavaScript eingefügte externe Skripte laufen standardmäßig asynchron, in der Reihenfolge, in der ihr Download abgeschlossen wird. Mit async = false laufen sie in der Einfügereihenfolge. Das ist wichtig, wenn eine Bibliothek von einer anderen abhängt.
• Inline-Snippets laufen sofort. Ein Inline-Skript wird ausgeführt, sobald es eingefügt ist, ohne auf externe Skripte zu warten. Die meisten Anbieter-Snippets stellen ihre Aufrufe in eine Warteschlange, bis die Bibliothek geladen ist. Prüfen Sie aber jeden eigenen Code, der voraussetzt, dass eine Bibliothek bereits vorhanden ist.
• document.write(). Alte Snippets, die diese Methode aufrufen, funktionieren nicht mehr, sobald die Seite geladen ist. Ersetzen Sie sie durch das asynchrone Snippet des Anbieters.

Welche Blockierungsmethode sollte ich verwenden?

Die meisten Websites kombinieren mehrere Methoden, je nachdem, wo das jeweilige Tag eingebunden ist.

Methode	Am besten geeignet für	Worauf Sie achten sollten
Inaktive text/plain-Tags	Fest in Templates eingebundene Tags	Jedes Tag muss bearbeitet werden; Ausführungsreihenfolge
Consent-bewusster Loader im eigenen Code	SPAs und über npm installierte SDKs	SDKs, die sich initialisieren, sobald sie importiert werden
Consent-Einstellungen im Tag-Manager	Teams, die Tags in einem Tag-Manager verwalten	Jedes Tag braucht die richtige Consent-Anforderung
Automatische Blockierung	Große Legacy-Websites mit vielen fest eingebundenen Tags	Muss zuerst synchron laden; kann Skripte übersehen oder beschädigen
Iframe-Platzhalter	Video-, Karten- und Social-Media-Embeds	Der Platzhalter muss erklären, was das Laden bedeutet

Über npm installierte Bibliotheken erscheinen nie als Script-Tags, die Absicherung liegt also in Ihrem eigenen Code. Rufen Sie init() des SDK erst nach der Einwilligung auf und laden Sie es per dynamischem import(), damit es vorher nicht einmal heruntergeladen wird. Dieses Muster und den Umgang mit Entscheidungen, die sich mitten in der Sitzung ändern, behandelt der Beitrag Cookie-Einwilligung in Single-Page-Apps.

Für Google-Tags gibt es eine zusätzliche Option. Mit Google Consent Mode können Tags vor der Einwilligung laden und ihr Verhalten an die Consent-Signale anpassen, statt blockiert zu werden. Ob dieses Setup zu Ihrer Risikobereitschaft passt, ist eine eigene Entscheidung; siehe einfacher vs. erweiterter Consent Mode.

Wie prüfe ich, ob die Blockierung funktioniert?

Testen Sie wie ein neuer Besucher und prüfen Sie, was tatsächlich im Netzwerk und im Speicher passiert:

1. Öffnen Sie die Website in einem frischen privaten Fenster aus einer Region, in der Ihr Banner erscheint.
2. Öffnen Sie die DevTools, bevor Sie irgendetwas anklicken, und prüfen Sie das Network-Panel. Es sollte keine Requests an Analyse- oder Werbe-Domains geben, es sei denn, Sie haben sich bewusst für ein Setup entschieden, das sie sendet.
3. Prüfen Sie im Application-Panel Cookies, Local Storage und Session Storage. Es sollten nur unbedingt erforderliche Einträge vorhanden sein.
4. Klicken Sie auf „Alle ablehnen“ und vergewissern Sie sich, dass nichts Neues geladen oder gespeichert wird.
5. Akzeptieren Sie in einer neuen Sitzung jeweils eine Kategorie und vergewissern Sie sich, dass nur deren Skripte und Embeds geladen werden.
6. Wiederholen Sie den Test nach jedem Release, das ein Tag hinzufügt, und führen Sie regelmäßig ein Cookie-Audit durch, um Tags zu finden, die außerhalb Ihres Release-Prozesses hinzugefügt wurden.

Fazit

Beim Blockieren geht es um die Ausführung, nicht nur um Cookies: Sobald ein nicht notwendiges Skript läuft, kann es Daten speichern oder auslesen, bevor jemand zugestimmt hat. Liefern Sie Tags inaktiv aus, aktivieren Sie sie nach einem Opt-in je Kategorie, sichern Sie Embeds und SDKs auf dieselbe Weise ab und testen Sie in einem sauberen Browser. Tools wie Cookiesh können den Aktivierungsschritt automatisieren und Skripte mit der Kennzeichnung type="text/plain" data-cookiesh="analytics" erst ausführen, nachdem der Besucher in diese Kategorie eingewilligt hat.

Dieser Artikel dient der allgemeinen Information und stellt keine Rechtsberatung dar. Für Entscheidungen zu Ihrer konkreten Situation wenden Sie sich an qualifizierte Datenschutzfachleute.