TypeScript - הוספת Google Analytics עם מנהל הסכמה לאתר SvelteKit
אני צריך להוסיף את Google Analytics לאתר SvelteKit. ההוראות מגוגל הן שיש להוסיף את הסקריפט למטה לתג <head>, ולכן חשבתי שאוכל פשוט להוסיף אותו ב-app.html. הבעיה היא שאני צריך להשתמש במצב הסכמה (Consent Mode) כדי לעמוד בתקנות GDPR. כדי לעשות זאת, אני צריך להיות מסוגל לקרוא ולכתוב למשתנה כלשהו כדי לאפשר ולכבות את האנליטיקה.
לפי מה שאני יכול להבין, אני לא מצליח לגשת לשום משתנה מתוך תגית <head>. גם ניסיתי להוסיף את אותו קוד לתוך תגית <svelte:head> ב-__layout.svelte, אבל נראה שגם שם אני לא מצליח לגשת למשתנים.
אני מתכנן לעקוב אחרי הסכמה לעוגיות באמצעות חנות, ולשמור את הערך הזה בזיכרון המקומי, אבל אני פתוח לפתרונות אחרים גם כן.
הנה הקוד שיש להוסיף לתגית <head>:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-H5XGB0JC8S"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-H5XGB0JC8S');
</script>
הנה הקוד שצריך להוסיף כדי להשבית את האנליטיקה:
gtag('consent', 'default', {
analytics_storage: 'denied',
ad_storage: 'denied'
});
והנה הקוד לקריאה לעדכון ערך:
gtag('consent', 'update', {
'ad_storage': 'granted'
});
אני מניח שקטע הקוד האחרון צריך להיות נקרא כשכפתור האישור נלחץ, אך אם אני קורא ל-gtag מכל מקום אחר חוץ מהמקום שבו קטע הקוד הראשון נמצא, אני מקבל אזהרה שאומרת שהפונקציה לא מוגדרת.
האם אני צריך להוסיף את הקוד במקום אחר, או שצריך לעשות זאת בצורה אחרת?
אולי כדאי שאציין שאני משתמש גם ב-TypeScript.