Google Consent Mode v2

<ConsentMode /> vidarebefordrar besökarens val till Google-taggar (GA4, Google Ads, Google Tag Manager) som Consent Mode v2-signaler. Den sätter ett standardläge där allt är denied innan någon Google-tagg körs, och skickar sedan en consent update när besökaren väljer – och vid varje senare sidladdning när valet väl är gjort.

Alla fyra samtyckestyper i v2 täcks: ad_storage, ad_user_data, ad_personalization och analytics_storage.

Tillgängligt från version 1.0.0.

Konfiguration

Rendera <ConsentMode /> i <head>, ovanför alla Google-kodavsnitt. Consent Mode kräver att standardläget är satt innan en Google-tagg laddas, och därför är det en separat komponent i stället för en del av <ConsentBanner /> (som renderas i <body>):

---
import ConsentBanner from 'astro-cookie-consent/ConsentBanner.astro';
import ConsentMode from 'astro-cookie-consent/ConsentMode.astro';
---

<html>
  <head>
    <ConsentMode
      mapping={{
        analytics: ['analytics_storage'],
        marketing: ['ad_storage', 'ad_user_data', 'ad_personalization'],
      }}
    />
    <!-- Google snippet goes after this -->
  </head>
  <body>
    <slot />
    <ConsentBanner
      privacyHref="/privacy"
      categories={[
        { id: 'analytics', label: 'Analytics' },
        { id: 'marketing', label: 'Marketing' },
      ]}
    />
  </body>
</html>

Koppla kategorier till samtyckestyper

mapping kopplar bannerns kategori-id:n till de Consent Mode-typer de ger. En typ är granted om någon godkänd kategori är kopplad till den, annars denied.

Med en enkel godkänn/avböj-banner (utan categories) utelämnar du mapping. Standardvärdet gör att det enda valet styr alla fyra typerna:

<ConsentMode />

Ladda Google-taggen

Det finns två sätt att ladda Googles tagg tillsammans med <ConsentMode />.

Grundläge (rekommenderas)

Ladda Google-taggen först efter samtycke, med gateScript(). Inget når Google innan besökaren godkänner:

<script is:inline>
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXX');
</script>
<script>
  import { gateScript } from 'astro-cookie-consent';

  gateScript({
    src: 'https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX',
    category: 'analytics',
  });
</script>

<ConsentMode /> definierar window.gtag, så de köade js- och config-anropen plockas upp när gtag.js laddas.

Avancerat läge

Ladda Googles standardkodavsnitt (eller GTM:s) utan blockering, efter <ConsentMode />. Medan samtycke är nekat skickar Google-taggar cookiefria pingar, vilket låter Google modellera mer av din data.

Google Tag Manager läser samma dataLayer, så dess inbyggda samtyckeskontroller fungerar i båda lägena.

Props

Prop	Standard	Beskrivning
`mapping`	`{ all: [all 4 types] }`	Kategori-id → Consent Mode-typer som kategorin ger.
`expiryDays`	`365`	Måste matcha `<ConsentBanner expiryDays>`.
`waitForUpdate`	`500`	Millisekunder som Google-taggar väntar på en uppdatering innan de körs.
`adsDataRedaction`	`false`	Döljer annonsklick-id:n medan `ad_storage` är nekat.
`urlPassthrough`	`false`	Skickar annonsklickinformation via URL:er medan cookies är nekade.
`region`	(överallt)	ISO 3166-2-koder som det nekade standardläget gäller för, t.ex. bara EES-länder.

Kontrollera att det fungerar

Öppna webbplatsen med webbläsarens utvecklarverktyg och skriv dataLayer i konsolen. Innan något val görs ser du en consent / default-post där varje kopplad typ är denied. När du har godkänt eller avböjt i bannern följer en consent / update-post med det nya läget. Googles Tag Assistant visar samma signaler för varje tagg.