In der Netzgemeinde hat sich der Begriff des Cookie-Terror-Banners
längst etabliert. Hintergrund ist eine EU-Vorgabe, dass Seitenbetreiber
nur dann Cookies auf dem Gerät ihrer Besucher speichern dürfen, wenn
diese dem zustimmen.
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.
(function () {
'use strict';
const terrorBanners = [
{
elements: '[id^="sp_message_container"]',
classes: { element: "html", name: "sp-message-open" }
},
{ elements: "#onetrust-consent-sdk" },
{ elements: "ion-modal" },
{ elements: ".cc-banner" },
{ elements: "#usercentrics-root" },
{
elements: "#didomi",
classes: { element: "body", name: "didomi-popup-open" }
},
{
elements: "#cmpbox, #cmpbox2",
attributes: { element: "body", name: "style" }
},
{
classes: [
{ element: "*", name: "modal-backdrop" },
{ element: "*", name: "modal-cmp" }
]
},
{ elements: "div.needsclick" },
{ elements: "div.snigel-cmp-framework" },
{ 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.