Cómo bloquear scripts hasta que se da el consentimiento: tres métodos comparados

El problema: etiquetas que se disparan demasiado pronto

Un banner de consentimiento solo funciona si las etiquetas que hay detrás respetan la elección del visitante. El fallo más habitual es simple: aparece el banner, pero los scripts de analítica y publicidad ya se han cargado y han establecido identificadores antes de que nadie hiciera clic. Arreglarlo implica bloquear los scripts hasta que se da el consentimiento. Hay tres formas prácticas de hacerlo.

Método 1: reescribir el tipo del script

Los navegadores solo ejecutan un elemento script cuando su tipo es un tipo de JavaScript. Si cambias el tipo a text/plain, el navegador ignora el script. Después añades un atributo data que registra a qué categoría de consentimiento pertenece el script:

Ideal para: un puñado de scripts conocidos, en línea o externos, en tus plantillas. Cuidado con: los scripts inyectados por otros scripts, que nunca pasan por tus plantillas y por tanto nunca se reescriben.

Método 2: controlar las etiquetas en un gestor de etiquetas

Si tus etiquetas están en Google Tag Manager o una herramienta similar, puedes dejar el contenedor en la página y controlar el disparo con activadores que tengan en cuenta el consentimiento. A cada etiqueta se le asigna un requisito de consentimiento, y el gestor de etiquetas solo la dispara cuando se concede el estado de consentimiento correspondiente. La gran ventaja es el control centralizado: marketing puede añadir etiquetas sin tocar las plantillas, y la regla viaja con la etiqueta.

Ideal para: sitios con muchas etiquetas de marketing. Cuidado con: los scripts codificados directamente fuera del contenedor y las etiquetas HTML personalizadas que cargan sus propios scripts adicionales.

Método 3: cargar los scripts dinámicamente con el consentimiento

Aquí eliminas por completo las etiquetas script de la página y escribes una función que las inyecta solo después de un evento de consentimiento. Es la opción más limpia para aplicaciones de página única y para desarrolladores que quieren control total:

  1. Escucha el callback de consentimiento de tu CMP.
  2. Comprueba qué categorías se concedieron.
  3. Crea un elemento script, establece su origen y añádelo al documento.
  4. Ejecuta cualquier código de inicialización en el manejador de carga del script.

Ideal para: aplicaciones modernas con paso de compilación. Cuidado con: olvidar gestionar al visitante recurrente, cuya elección guardada debe activar la carga al cargar la página sin un nuevo clic.

Gestionar la retirada del consentimiento

Bloquear antes del consentimiento es solo la mitad del trabajo. Si un visitante retira después su consentimiento, deja de llamar a las herramientas y asegúrate de que no sigan leyendo ni escribiendo identificadores. Quitar un script de la página no elimina el código que ya está en memoria, así que recargar tras la retirada suele ser el enfoque fiable más sencillo.

¿Cuál deberías elegir?

Cómo probarlo

  1. Abre una ventana privada con la caché borrada.
  2. Abre las herramientas de desarrollo del navegador en las pestañas Network y Application antes de cargar la página.
  3. Carga la página y no toques el banner. Confirma que no se envían solicitudes de analítica ni de publicidad y que no aparecen cookies ni entradas de almacenamiento relacionadas.
  4. Acepta solo una categoría y confirma que únicamente se cargan los scripts correspondientes.
  5. Rechaza todo, recarga y repite la primera comprobación.
  6. Retira el consentimiento y verifica el comportamiento descrito arriba.

Dónde encaja FlexyConsent

FlexyConsent es compatible con IAB TCF 2.4 y Google Consent Mode v2, y es una CMP certificada por Google (CMP ID 317). Elijas el método de bloqueo que elijas, el trabajo del banner es dar a tu código una señal clara de lo que eligió el visitante. Tu trabajo es asegurarte de que cada script la obedezca.

Conclusiones clave

← Blog Leer todo →