Auslesen des Consent-Status

Für eine datenschutzkonforme Nutzung von eingebetteten Drittanbieterdiensten spielt der Content Blocker diese Inhalte erst nach erteilter Zustimmung des Benutzers aus. Dieses eingebaute Feature setzt jedoch voraus, dass die Inhalte per iFrame in die Website eingebettet werden. Um auch Dienste, die direkt in die Website integriert sind, datenschutzkonform von der Zustimmung des Besuchers abhängig zu machen, können die benötigten Informationen aus dem DataLayer gelesen werden.

So startest du beispielsweise einen integrierten Video-Player, Karten-Widgets oder Chat-Tools erst dann, wenn die spezifische Einwilligung dafür vorliegt.

Der etracker consent manager kann die Einwilligungen der Besucher also nicht nur dem etracker tag manager zur Verfügung stellen, sondern auch deinem eigenen individuellen JavaScript oder auch anderen Tag-Management-Systemen, die auf deiner Website eingebunden sind.

Funktionsweise

Der etracker consent manager schreibt in zwei Situationen einen Eintrag in das Array window.dataLayer:

1. Bei jedem Seitenaufruf mit dem aktuell gespeicherten Status.
2. Bei jeder Änderung, also wenn ein Besucher im Consent-Dialog seine Auswahl ändert oder einen blockierten iFrame Inhalt über das Overlay freigibt.

Der Eintrag heißt etConsentStatus. Das Feld action sagt dir, welche der beiden Situationen vorliegt (onInitialPageLoad / onUpdateServices).

Hat der Besucher noch keine Entscheidung getroffen, enthält der Eintrag initial nur event und action:

{
 "event": "etConsentStatus",
 "action": "onInitialPageLoad" 
}

Für jeden Dienst, zu dem eine Entscheidung vorliegt, enthält der Eintrag einen Schlüssel aus Consent-Kategorie und Anbieter-ID (z.B. performance:youtube) mit dem Wert true (Einwilligung erteilt) oder false (Einwilligung verweigert).

Beispiel für den Eintrag beim Seitenaufruf mit gespeicherter Entscheidung:

{
  "event": "etConsentStatus",
  "action": "onInitialPageLoad",
  "statistics:etracker": false,
  "performance:youtube": false,
  "marketing:123456": false
}

Beispiel für den Eintrag nach dem Speichern im Consent-Dialog:

{
  "event": "etConsentStatus",
  "action": "onUpdateServices",
  "statistics:etracker": true,
  "performance:youtube": true,
  "marketing:123456": false
}

Die Felder im Überblick

So findest du die Schlüssel deiner Dienste

Die Kategorie ist die Consent-Kategorie des Dienstes:

• Marketing: marketing
• Funktionell: performance
• Statistik: statistics
• Notwendig: no_consent

Die Anbieter-ID findest du im etracker tag manager unter Meine Anbieter in der Spalte ID. Sie kann ein Name wie "youtube" (bei vordefinierten Standardanbietern) oder eine Zahl (bei eigenen Anbietern) sein.

Am schnellsten siehst du die Schlüssel deiner Website, wenn du in der Browser-Konsole den gespeicherten Status ausliest. Um sicherzugehen, dass ALLE Einträge angezeigt werden, verwende zuvor im Consentdialog den "Alles Erlauben"-Button.

localStorage.getItem('et_oi_services');

Der Wert hat dieselben Schlüssel wie der dataLayer-Eintrag. Mehr dazu unter Verwendete Cookies.

Hinzufügen eines Anbieters durch Verwendung eines Pseudo-Tags im etracker tag manager

Damit ein Anbieter im Consent-Dialog auftaucht, erstelle, wie unter Einbinden von Drittanbieter-Tags beschrieben, ein leeres "Custom" Pseudo-Tag (setzt eine etracker analytics Enterprise Edition voraus) und ordne dem Tag die gewünschte Consent-Kategorie und den entsprechenden Anbieter des Dienstes zu. Es ist ausreichend, dass das Tag veröffentlich wird. Es muss nicht durch einen Trigger ausgespielt werden.

Mit dem etracker tag manager indirekt auf den Consent-Status reagieren

Den dataLayer-Eintrag brauchst du im etracker tag manager nur, wenn ein Tag den Consent-Status auslesen muss, statt (wie üblich) direkt an ihn gebunden zu sein:

• Ein Tag soll bei einer Ablehnung oder einem Widerruf ausgespielt werden, zum Beispiel um einen laufenden Player zu entfernen oder einen alternativen Platzhalter in die Website einzubinden.
• Ein Tag soll vom Status eines anderen Dienstes abhängen als dem, an den es gebunden ist.

Gehe dafür wie folgt vor:

1. Variable anlegen. Erstelle eine Variable vom Typ „Datalayer-Variable" und trage bei "Name der Datalayer-Variable" den Schlüssel des Dienstes (z.B. performance:youtube) ein. Aktiviere die Option „Nur aktuelles Element durchsuchen", damit die Variable nur den auslösenden Eintrag liest.
2. Trigger anlegen. Erstelle einen Trigger vom Typ „Datalayer Push" mit der Bedingung event Ist gleich etConsentStatus. Unter "Trigger gilt für (alle Bedingungen müssen zutreffen)" ergänze als "Benutzerdefiniertes Ereignis" die Variable aus Schritt 1 mit dem Wert, auf den das Tag reagieren soll, zum Beispiel Ist gleich false.
   Soll das Tag nur auf eine Änderung reagieren und nicht schon beim Seitenaufruf, erstelle eine weitere etracker Variable für die DataLayer-Variable action . Setze im Trigger dann für diese Variable die weitere Bedingung Ist gleich onUpdateServices.
3. Tag anlegen. Da das Tag auch bei verweigerter Einwilligung laufen muss, bekommt es die Consent-Kategorie „Keine". Durch die Zuweisung des Triggers aus Schritt 2, wird es immer dann ausgeführt, wenn sich der Status der Zustimmung, wie in unserem Beispiel auf false , ändert.

Den Consent-Status für eigenes JavaScript nutzen

Liegt dein Code nicht im etracker tag manager, sondern direkt im Code der Website, kannst du den dataLayer selbst auslesen. Das folgende Pattern verarbeitet zuerst die Consent Einträge, die vor dem Start deines Skripts gespeichert wurden, und reagiert danach auf neue Einträge. Binde es nach dem etracker-Code ein.

window.dataLayer = window.dataLayer || [];

(function () {
  var state = null; // null = no status has been read yet
  var lastAction;
  var listeners = [];

  function apply(entry) {

    if (!entry || entry.event !== 'etConsentStatus') return;
    var next = {};

    Object.keys(entry).forEach(function (key) {
      if (key.indexOf(':') > -1) next[key] = entry[key];
    });

    state = next;
    lastAction = entry.action;
    listeners.forEach(function (fn) { fn(state, entry.action); });
  }

  // 1. Entries Already Written
  window.dataLayer.forEach(apply);

  // 2. Later Entries
  var originalPush = window.dataLayer.push;
  window.dataLayer.push = function () {
    var result = originalPush.apply(this, arguments);
    Array.prototype.forEach.call(arguments, apply);
    return result;
  };

  window.etConsent = {
    // true = consent, false = decline, undefined = no decision
    get: function (key) { return state ? state[key] : undefined; },
    onChange: function (fn) {
      listeners.push(fn);
      if (state) fn(state, lastAction);
    }
  };
})();

So startest du damit einen Video-Player erst nach der Einwilligung und nur einmal:

window.initVideoPlayer = window.initVideoPlayer || (function () {
  var started = false;

  return function () {
    if (started) return;
    started = true;
    // Initialize the player here
  };
})();

etConsent.onChange(function (status) {
  if (status['performance:youtube'] === true) {
    window.initVideoPlayer();
  }
});

Den gespeicherten Status kannst du außerdem jederzeit synchron aus dem localStorage lesen, zum Beispiel bevor du einen Platzhalter rendern willst:

var consent = {};

try {
  consent = JSON.parse(localStorage.getItem('et_oi_services') || '{}');
}

catch (e) {
  consent = {};
}

var youtubeAllowed = consent['performance:youtube'] === true;

Der localStorage meldet dir keine Änderungen. Nutze ihn deshalb für den Startzustand und den dataLayer für Änderungen.

Den Consent-Status für anderen Tag-Management-Systemen nutzen

Verwendest du den etracker consent manager zusammen mit einem Tag-Management-System eines anderen Anbieters, lege dort einen Trigger auf das dataLayer-Ereignis etConsentStatus an und lies, entsprechend dieser Anleitung, die Schlüssel deiner Dienste als Datalayer-Variablen aus. Prüfe in der Bedingung auf den Wert true, und behandle einen fehlenden Schlüssel nicht wie false .

Hinweise zum Testen

• Teste im Debug-Modus des etracker tag managers mit dem URL-Parameter et_debug=1, ob dein Tag beim Seitenaufruf, nach einer Zustimmung ohne Neuladen und nach einem Neuladen genau einmal ausgeführt wird.
• Das Verhalten nach einem Widerruf im selben Seitenaufruf prüfst du mit veröffentlichten Tags ohne Debug-Modus. Im Debug-Modus kann ein Tag nach dem Widerruf einmal zusätzlich ausgeführt werden.
• Um den Zustand „keine Entscheidung" herzustellen, entferne et_oi_services und et_allow_cookies aus dem localStorage und aus den Cookies deiner Domain und lade die Seite neu.
• Nutze für die Steuerung deiner Logik ausschließlich den Eintrag etConsentStatus. Weitere Einträge, die der etracker consent manager in den dataLayer schreibt, sind nicht Teil dieser Schnittstelle.