Matomo-Tracking und Aufrufzaehlung absichern

2026-08-27 12:20:56 +02:00
parent 528af07890
commit c86803bbd6
26 changed files with 1019 additions and 106 deletions
@@ -0,0 +1,192 @@
+(function () {
+    'use strict';
+
+    var configurationElement = document.getElementById('analytics-configuration');
+    var banner = document.getElementById('analytics-consent');
+    var settingsButton = document.getElementById('analytics-consent-settings');
+
+    if (!configurationElement || !banner || !settingsButton) {
+        return;
+    }
+
+    var configuration;
+    try {
+        configuration = JSON.parse(configurationElement.textContent || '');
+    } catch (error) {
+        return;
+    }
+
+    var cookieName = configuration.consentCookie;
+    var visitorCookieName = configuration.visitorCookie;
+    var consentVersion = configuration.consentVersion;
+    var pageViewSent = false;
+
+    function readCookie(name) {
+        var cookies = document.cookie ? document.cookie.split(';') : [];
+        for (var index = 0; index < cookies.length; index += 1) {
+            var parts = cookies[index].trim().split('=');
+            var currentName = decodeURIComponent(parts.shift() || '');
+            if (currentName === name) {
+                return decodeURIComponent(parts.join('='));
+            }
+        }
+        return null;
+    }
+
+    function readDecision() {
+        var value = readCookie(cookieName);
+        var expectedPrefix = consentVersion + ':';
+        if (!value || value.indexOf(expectedPrefix) !== 0) {
+            return null;
+        }
+
+        var decision = value.slice(expectedPrefix.length);
+        return decision === 'granted' || decision === 'denied' ? decision : null;
+    }
+
+    function cookieSuffix() {
+        var suffix = '; Path=/; Max-Age=' + String(configuration.consentMaxAge) + '; SameSite=Lax';
+        if (configuration.cookieDomain) {
+            suffix += '; Domain=' + configuration.cookieDomain;
+        }
+        if (configuration.secureCookies || window.location.protocol === 'https:') {
+            suffix += '; Secure';
+        }
+        return suffix;
+    }
+
+    function writeCookie(name, value) {
+        document.cookie = encodeURIComponent(name) + '=' + encodeURIComponent(value) + cookieSuffix();
+    }
+
+    function writeDecision(decision) {
+        writeCookie(cookieName, consentVersion + ':' + decision);
+    }
+
+    function randomVisitorId() {
+        var bytes = new Uint8Array(8);
+        window.crypto.getRandomValues(bytes);
+        return Array.prototype.map.call(bytes, function (value) {
+            return value.toString(16).padStart(2, '0');
+        }).join('');
+    }
+
+    function ensureVisitorId() {
+        var visitorId = readCookie(visitorCookieName);
+        if (!visitorId || !/^[0-9a-f]{16}$/.test(visitorId)) {
+            visitorId = randomVisitorId();
+            writeCookie(visitorCookieName, visitorId);
+        }
+        return visitorId;
+    }
+
+    function URLWithoutParameters(value) {
+        try {
+            var url = new URL(value, window.location.href);
+            return url.origin + url.pathname;
+        } catch (error) {
+            return '';
+        }
+    }
+
+    function sendPageView() {
+        if (pageViewSent || readDecision() !== 'granted') {
+            return;
+        }
+        pageViewSent = true;
+
+        var now = new Date();
+        var payload = {
+            visitorId: ensureVisitorId(),
+            pageUrl: URLWithoutParameters(window.location.href),
+            pageTitle: document.title || 'Kaffeeliste',
+            referrerUrl: URLWithoutParameters(document.referrer),
+            resolution: window.screen && window.screen.width && window.screen.height
+                ? String(window.screen.width) + 'x' + String(window.screen.height)
+                : '',
+            language: window.navigator.language || '',
+            h: now.getHours(),
+            m: now.getMinutes(),
+            s: now.getSeconds()
+        };
+
+        window.fetch(configuration.trackingEndpoint, {
+            method: 'POST',
+            credentials: 'same-origin',
+            headers: {'Content-Type': 'application/json'},
+            body: JSON.stringify(payload),
+            keepalive: true
+        }).catch(function () {
+            // Analysefehler duerfen die Website niemals beeintraechtigen.
+        });
+    }
+
+    function expireCookie(name, domain) {
+        var value = encodeURIComponent(name) + '=; Path=/; Max-Age=0; SameSite=Lax';
+        if (domain) {
+            value += '; Domain=' + domain;
+        }
+        if (configuration.secureCookies || window.location.protocol === 'https:') {
+            value += '; Secure';
+        }
+        document.cookie = value;
+    }
+
+    function removeAnalysisCookies() {
+        var cookies = document.cookie ? document.cookie.split(';') : [];
+        cookies.forEach(function (cookie) {
+            var name = decodeURIComponent(cookie.trim().split('=')[0] || '');
+            if (name !== visitorCookieName && name.indexOf('_pk_') !== 0 && name.indexOf('mtm_') !== 0) {
+                return;
+            }
+            expireCookie(name, '');
+            if (configuration.cookieDomain) {
+                expireCookie(name, configuration.cookieDomain);
+            }
+        });
+    }
+
+    function closeBanner() {
+        banner.hidden = true;
+        settingsButton.hidden = false;
+    }
+
+    function choose(decision) {
+        writeDecision(decision);
+        closeBanner();
+        if (decision === 'granted') {
+            sendPageView();
+        } else {
+            removeAnalysisCookies();
+        }
+        window.dispatchEvent(new CustomEvent('kaffeeliste:analytics-consent', {
+            detail: {analytics: decision}
+        }));
+    }
+
+    banner.querySelectorAll('[data-analytics-consent]').forEach(function (button) {
+        button.addEventListener('click', function () {
+            choose(button.getAttribute('data-analytics-consent'));
+        });
+    });
+
+    settingsButton.addEventListener('click', function () {
+        banner.hidden = false;
+        settingsButton.hidden = true;
+        var firstButton = banner.querySelector('[data-analytics-consent="denied"]');
+        if (firstButton) {
+            firstButton.focus();
+        }
+    });
+
+    var initialDecision = readDecision();
+    if (initialDecision === 'granted') {
+        settingsButton.hidden = false;
+        sendPageView();
+    } else if (initialDecision === 'denied') {
+        settingsButton.hidden = false;
+        removeAnalysisCookies();
+    } else {
+        banner.hidden = false;
+    }
+}());