• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

ReactJS - baner o ciasteczkach - obsługa GTM

VMware Cloud PRO - przenieś swoją infrastrukturę IT do chmury
0 głosów
100 wizyt
pytanie zadane 13 września 2023 w JavaScript przez devonnnn Nowicjusz (160 p.)

Cześć, 
Mam za zadanie przygotować baner informujący o korzystaniu z ciasteczek. Baner wygląda tak:

Mam problem ze zrozumieniem działania/logiki. 
Mam tag GTM-XXXXXX.
Mam taki kod React:
 

const [consent, setConsent] = useState({
        essential: true,
        analytics: false,
        marketing: false,
      });
    
      const [displayBanner, setDisplayBanner] = useState(false);
    
      useEffect(() => {
        const hasConsent = localStorage.getItem('cookieConsent');
        if (!hasConsent) {
          setDisplayBanner(true);
        }
      }, []);
    
      const handleConsentChange = (event) => {
        const { name, checked } = event.target;
        setConsent((prevConsent) => ({
          ...prevConsent,
          [name]: checked,
        }));
      };
    
      const handleAcceptAll = () => {
        setConsent({
          essential: true,
          analytics: true,
          marketing: true,
        });
    
        localStorage.setItem('cookieConsent', JSON.stringify(consent));
        setDisplayBanner(false);
    
        // Dodaj obsługę GTM - wywołaj zdarzenie lub przekaż dane do GTM
        // window.dataLayer = window.dataLayer || [];
        // window.dataLayer.push({
        //   'event': 'cookieConsentGiven',
        //   'consent': 'all',
        // });
      };
    
      const handleAcceptSelected = () => {
        localStorage.setItem('cookieConsent', JSON.stringify(consent));
        setDisplayBanner(false);
    
        // Dodaj obsługę GTM - wywołaj zdarzenie lub przekaż dane do GTM
        const selectedConsent = Object.keys(consent)
          .filter((key) => consent[key])
          .join(',');
        console.log("selectedConsent:", selectedConsent)
        // window.dataLayer = window.dataLayer || [];
        // window.dataLayer.push({
        //   'event': 'cookieConsentGiven',
        //   'consent': selectedConsent,
        // });
      };

      const handleReject = () => {
        console.log("odrzucam wzystkie")
        setDisplayBanner(false);
      };

Co zrobić gdy użytkownik zaakceptuje wszystkie zgody? Jak połączyć logikę tego banera z GTM? 
A co zrobić jeżeli użytkownik zaakceptuje jedynie niezbędne ciasteczka albo niezbędne + marketing (bez analizy)? 
Myślę że nie ja jeden się nad tym głowię więc może komuś też taka wiedza się przyda. 
Pozdrawiam :) 

P.S. Próbowałem wykorzystać chatGPT ale za dużo to on mi nie pomógł :/ 

Zaloguj lub zarejestruj się, aby odpowiedzieć na to pytanie.

Podobne pytania

0 głosów
1 odpowiedź 216 wizyt
pytanie zadane 3 września 2020 w JavaScript przez poldeeek Mądrala (5,980 p.)
+1 głos
1 odpowiedź 494 wizyt
0 głosów
2 odpowiedzi 1,504 wizyt

93,434 zapytań

142,429 odpowiedzi

322,662 komentarzy

62,799 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

...