Consentl

Consentl cu Nuxt

Adăugați scriptul de încărcare Consentl în Nuxt 3 și 4 cu app.head și tagPriority 0, astfel încât să fie afișat înaintea oricărui alt script.

Scriptul de încărcare primul în <head>
Da

Scriptul de încărcare trebuie să fie primul script din <head> și sincron. Managerul de head al Nuxt (Unhead) sortează etichetele din <head> după pondere; ponderile mai mici sunt afișate primele:

Etichetă Pondere
charset −20
viewport −15
title 10
script asincron 30
script sincron 50
foaie de stil 60
intrarea modulului Nuxt 80

tagPriority: 0 plasează scriptul de încărcare înaintea oricărui alt script. "critical" (pondere 42) ar veni totuși după scripturile asincrone.

nuxt.config.ts

export default defineNuxtConfig({
  app: {
    head: {
      script: [
        {
          src: `https://api.consentl.com/v1/loader.js?k=${process.env.NUXT_PUBLIC_CONSENTL_SITE_KEY}&l=en`,
          tagPosition: "head",
          tagPriority: 0,
        },
      ],
    },
  },
});

Limba pentru fiecare solicitare (@nuxtjs/i18n)

Folosiți aceleași opțiuni în app.vue:

const { locale } = useI18n();
useHead({
  script: [{ src: computed(() => `https://api.consentl.com/v1/loader.js?k=${key}&l=${locale.value}`), tagPosition: "head", tagPriority: 0 }],
});

Schimbarea limbii pe client nu reîncarcă bannerul; noua limbă se aplică la următoarea încărcare completă a paginii.

Alte etichete (app.head sau useHead)

Dați fiecărei etichete care trebuie să aștepte consimțământul type: "text/plain" și categoria sa Consentl. Nuxt o scrie așa cum este, browserul nu o descarcă, iar Consentl o rulează o singură dată după consimțământ:

script: [
  { src: loader, tagPosition: "head", tagPriority: 0 }, // the Consentl loader, as above
  { src: "https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX", type: "text/plain", "data-consentl": "analytics" },
  {
    innerHTML: "window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments)}gtag('js',new Date());gtag('config','G-XXXXXXX');",
    type: "text/plain",
    "data-consentl": "analytics",
  },
],

O etichetă simplă { src, async: true } este reținută și ea în planul Business și rulează o singură dată, chiar dacă Nuxt adaugă o a doua copie a ei la pornirea paginii, dar browserul o descarcă înainte de consimțământ. În testul nostru (Nuxt 4.6, o etichetă Google): eticheta simplă async – o solicitare înainte de consimțământ și o rulare după acesta; type: "text/plain" – nicio solicitare înainte de consimțământ și o rulare după acesta.

Verificați că funcționează

Vizualizați sursa paginii: scriptul de încărcare este primul <script> din <head>. Apoi urmați verificările din Orice site. Navigarea pe client nu necesită nimic suplimentar, iar datele paginii Nuxt (__NUXT_DATA__, window.__NUXT__) nu sunt reținute niciodată. Testat cu Nuxt 4.6.

Consent Mode necesită planul Pro sau unul superior, iar blocarea automată a trackerelor cunoscute planul Business. Etichetele scrise în HTML-ul paginii (de exemplu prin app.head) sunt solicitate înainte de consimțământ, cu excepția cazului în care le marcați așa cum se arată în Alte etichete (consultați și Orice site).

Limitări

  • Nu adăugați scriptul de încărcare a doua oară dintr-o componentă sau dintr-un plugin: trebuie să se încarce o singură dată per document.
  • Dacă trimiteți o Content Security Policy, permiteți https://api.consentl.com (consultați Orice site).

V-ați blocat? Scrieți-ne la support@consentl.com — răspundem în limba engleză, în zilele lucrătoare.