108 lines
3.6 KiB
PHP
108 lines
3.6 KiB
PHP
@props([
|
|
'gtmId' => config('cookie-consent.gtm_id'),
|
|
'enabled' => config('cookie-consent.enabled', true),
|
|
'cookieName' => config('cookie-consent.cookie_name', 'cookie_consent'),
|
|
])
|
|
|
|
{{--
|
|
Google Tag Manager (noscript) Komponente
|
|
|
|
Diese Komponente muss direkt nach dem öffnenden <body> Tag eingefügt werden:
|
|
|
|
<body>
|
|
<x-cookie-consent::components.gtm-noscript />
|
|
...
|
|
</body>
|
|
|
|
Der noscript-Teil wird nur angezeigt, wenn:
|
|
1. GTM aktiviert ist (gtm_id gesetzt)
|
|
2. Der Cookie-Consent bereits erteilt wurde (analytics: true)
|
|
|
|
Hinweis: Bei JavaScript-deaktivierten Browsern funktioniert GTM ohnehin nicht vollständig,
|
|
aber der noscript-iframe ermöglicht grundlegendes Tracking.
|
|
--}}
|
|
|
|
@if ($enabled && $gtmId)
|
|
{{--
|
|
Alpine.js Wrapper für dynamische Anzeige basierend auf Cookie-Consent
|
|
Der noscript-Teil wird erst nach Zustimmung in den DOM eingefügt
|
|
--}}
|
|
<div x-data="{
|
|
gtmId: '{{ $gtmId }}',
|
|
cookieName: '{{ $cookieName }}',
|
|
hasConsent: false,
|
|
|
|
init() {
|
|
this.checkConsent();
|
|
|
|
// Auf Consent-Updates hören
|
|
window.addEventListener('cookie-consent-updated', (e) => {
|
|
this.hasConsent = e.detail && e.detail.analytics === true;
|
|
});
|
|
|
|
// Auf GTM-Load-Event hören
|
|
window.addEventListener('gtm-consent-granted', () => {
|
|
this.hasConsent = true;
|
|
});
|
|
},
|
|
|
|
checkConsent() {
|
|
const cookie = this.getCookie(this.cookieName);
|
|
if (cookie) {
|
|
try {
|
|
const settings = JSON.parse(cookie);
|
|
this.hasConsent = settings.analytics === true;
|
|
} catch (e) {
|
|
this.hasConsent = false;
|
|
}
|
|
}
|
|
},
|
|
|
|
getCookie(name) {
|
|
const nameEQ = name + '=';
|
|
const ca = document.cookie.split(';');
|
|
for (let i = 0; i < ca.length; i++) {
|
|
let c = ca[i].trim();
|
|
if (c.indexOf(nameEQ) === 0) {
|
|
return decodeURIComponent(c.substring(nameEQ.length));
|
|
}
|
|
}
|
|
return null;
|
|
}
|
|
}">
|
|
{{-- GTM noscript iframe - wird nur bei Consent angezeigt --}}
|
|
<template x-if="hasConsent">
|
|
<noscript>
|
|
<iframe x-bind:src="'https://www.googletagmanager.com/ns.html?id=' + gtmId" height="0" width="0"
|
|
style="display:none;visibility:hidden" title="Google Tag Manager"></iframe>
|
|
</noscript>
|
|
</template>
|
|
</div>
|
|
|
|
{{--
|
|
Fallback für Server-Side Rendering:
|
|
Wenn der Cookie bereits existiert und Analytics erlaubt,
|
|
können wir den noscript-Teil direkt rendern
|
|
--}}
|
|
@php
|
|
$cookieValue = request()->cookie($cookieName);
|
|
$serverSideConsent = false;
|
|
if ($cookieValue) {
|
|
try {
|
|
$decoded = json_decode($cookieValue, true);
|
|
$serverSideConsent = isset($decoded['analytics']) && $decoded['analytics'] === true;
|
|
} catch (\Exception $e) {
|
|
$serverSideConsent = false;
|
|
}
|
|
}
|
|
@endphp
|
|
|
|
@if ($serverSideConsent)
|
|
<!-- Google Tag Manager (noscript) -->
|
|
<noscript>
|
|
<iframe src="https://www.googletagmanager.com/ns.html?id={{ $gtmId }}" height="0" width="0"
|
|
style="display:none;visibility:hidden" title="Google Tag Manager"></iframe>
|
|
</noscript>
|
|
<!-- End Google Tag Manager (noscript) -->
|
|
@endif
|
|
@endif
|