SELFHTML Weblog - Ergänzung zur Dokumentation Übersicht

Das hat dazu geführt, dass man seit Jahren auf sehr vielen Webseiten Einblendungen vorfindet, die sich über den eigentlichen Seiteninhalt ausbreiten und sehr aufdringlich nach der Zustimmung verlangen, dass die Seite Cookies speichern darf. Solche Einblendungen sind im Alltag störend und nicht selten absichtlich unbequem in der Bedienung, wenn man nicht blind einfach alles abnicken möchte.

Entweder man schont seine Nerven und willigt brav in alles ein, was dem Ausspähen von Daten Tür und Tor öffnen kann, oder man installiert sich ein passendes Browser-Plugin, das einem die Werbung und datenschnüffelnde Cookies vom Hals hält wie z.B. uBlock origin. Wir wären aber nicht SELFHTML, wenn wir nicht auch eine Idee hätten, wie man sich nervige Einblendungen vom Hals halten könnte.

Solche Cookie-Banner werden per JavaScript über den eigentlichen Seiteninhalt gelegt, indem sie das Dokument im Browser um gewisse Elemente erweitern. Könnte man jetzt sein eigenes JavaScript-Programm ausführen, wäre es denkbar, diese Elemente wieder aus dem Dokument zu entfernen. Aber wie soll man ein JavaScript in eine fremde Seite einbinden, wenn man keinen Schreibzugriff auf dem jeweiligen Webserver hat?

Userscripte im Browser via Plugin

Mit entsprechenden Browser-Plugins wie z.B. Tampermonkey kann man eigene JavaScript-Dateien im Kontext einer fremden Website ausführen lassen. Damit kann man sich ein Script schreiben, das so manches Cookie-Banner erkennt und entfernt.

JavaScript im Browser bietet mit dem MutationObserver ein geeignetes Werkzeug an, um zu erkennen, wenn Teile des Dokuments im Browser verändert wurden, weil z.B. ein Element per JavaScript hinzugefügt wurde. Damit ist es dann ein Leichtes, auf bestimmte Elemente, Klassennamen oder Attributwerte zu prüfen, um die einschlägigen Banner zu finden. Das folgende Script bietet zwar nicht den Komfort und die Sicherheit, die ein Browser-Plugin wie uBlock origin bietet, aber als Spielerei gegen Cookie-Terror-Banner ist es allemal ein netter Zeitvertreib, vor allem dann, wenn man die jeweiligen Erkennungsmerkmale im Seiteninspektor herausfindet, um sie dann im Script zu ergänzen.

Das folgende Code-Listing kann als lokale Script-Datei in Tampermonkey hinterlegt werden. Die einzeiligen Kommentare am Anfang steuern auf welchen Seiten im Internet es eingebunden werden soll (aktuell auf allen, siehe die @match-Regeln). Hinweise zu seiner Funktionalität stehen nach dem Code-Listing.

// ==UserScript==
// @name Anti Terror Banner Script
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author Anti Terrorist Banner Coder
// @match https://*/*
// @match http://*/*
// @icon none
// @grant none
// @run-at document-end
// ==/UserScript==
 
(function () {
  'use strict';
   
  const terrorBanners = [
    // sp_message_container
    {
      elements: '[id^="sp_message_container"]',
      classes: { element: "html", name: "sp-message-open" }
    },
    // onetrust
    { elements: "#onetrust-consent-sdk" },
    // ion-modal
    { elements: "ion-modal" },
    // cc_banner
    { elements: ".cc-banner" },
    // usercentrics
    { elements: "#usercentrics-root" },
    // didomi
    {
      elements: "#didomi",
      classes: { element: "body", name: "didomi-popup-open" }
    },
    // cmpbox
    {
      elements: "#cmpbox, #cmpbox2",
      attributes: { element: "body", name: "style" }
    },
    // cmp-modal
    {
      classes: [
        { element: "*", name: "modal-backdrop" },
        { element: "*", name: "modal-cmp" }
      ]
    },
    // needsclick
    { elements: "div.needsclick" },
    // snigel
    { elements: "div.snigel-cmp-framework" },
    // gdpr-consent-tool
    { elements: "div#gdpr-consent-tool-wrapper" }
  ];
   
  const observer = new MutationObserver(mutations => {
   
    terrorBanners.forEach(banner => {
     
      if (banner.elements) {
        Array.from(document.querySelectorAll(banner.elements)).forEach(
          element => element.parentNode.removeChild(element)
        );
      }
       
      if (banner.attributes) {
        const attributes = (
          banner.attributes instanceof Array
          ? banner.attributes
          : [banner.attributes]
        );

        attributes.forEach(data => {
          if (data.element && data.name) {
            Array.from(document.querySelectorAll(data.element)).forEach(
              element => element.removeAttribute(data.name)
            );
          }
        });
      }

      if (banner.classes) {
        const classes = (
          banner.classes instanceof Array
          ? banner.classes
          : [banner.classes]
        );

        classes.forEach(data => {
          if (data.element && data.name) {
            Array.from(document.querySelectorAll(data.element)).forEach(
              element => element.classList.remove(data.name)
            );
          }
        });
      }
    });
  });

  observer.observe(document.body, {
    subtree: true,
    childList: true,
    attributes: false,
    characterData: false,
    attributeOldValue: false,
    characterDataOldValue: false
  });

})();

Im großen Array terrorBanners stehen einzelne Objekte, in denen die jeweiligen Erkennungsmerkmale hinterlegt sind. Ein solches Objekt kann diese Eigenschaften haben:

• elements - Selektor für Elemente, die zu entfernen sind
• attributes - Objekt (oder ein Array solcher Objekte), welches Namen von Attributen definiert, die von Objekten entfernt werden müssen:
  • element - Selektor für Elemente, die dieses Attribut haben können
  • name - Name des Attributs
• classes - Objekt (oder ein Array solcher Objekte), welches Namen von Klassen definiert, die von Objekten entfernt werden müssen:
  • element - Selektor für Elemente, die diese Klasse haben können
  • name - Name der Klasse

Fazit

Ein solches Script kann die Bedienung von Seiten erleichtern, weil es die Einblendungen wieder entfernt, welche die Benutzung der Seite ansonsten blockieren. Es gibt aber Banner-Mechanismen, die den eigentlichen Seiteninhalt durch ein unscharfes Hintergrundbild ersetzen. Auf solchen Seiten sieht man dann natürlich keine brauchbaren Inhalte, wenn man das Cookie-Banner entfernt. Und es ist keinesfalls garantiert, dass eine Seite nicht schon vor der Einwilligung durch den Benutzer mindestens ein Cookie setzt, auch wenn das klar gegen die EU-Verordnung verstößt. Aber für den Hobby-Bastler kann es Vergnügen bereiten, sich auf diese Weise gegen allzu penetrante Gängelungen zu wehren.