Cómo usar Tag Manager con una Política de Seguridad del Contenido

La Política de Seguridad del Contenido (CSP) es un estándar de seguridad web ampliamente admitido que tiene como objetivo evitar ciertos tipos de ataques basados en la inserción, ya que les brinda a los desarrolladores control sobre los recursos que cargan sus aplicaciones. Usa esta guía para comprender cómo implementar Google Tag Manager en sitios que usan un CSP.

Nota: Para garantizar que el CSP se comporte como se espera, es mejor usar las directivas report-uri o report-to para obtener informes de incumplimientos de política.

Habilita la etiqueta del contenedor para usar CSP

Para usar Google Tag Manager en una página con un CSP, este debe permitir la ejecución del código de contenedor de Tag Manager. Este código se compila como código JavaScript intercalado que inserta la secuencia de comandos gtm.js. Existen varias formas de hacerlo, como el uso de un nonce o un hash. El método recomendado es usar un nonce, que debe ser un valor aleatorio imposible de adivinar que el servidor genera de forma individual para cada respuesta. Proporciona el valor de nonce en la directiva script-src de Content-Security-Policy:

Content-Security-Policy:
script-src 'nonce-{SERVER-GENERATED-NONCE}';
img-src www.googletagmanager.com;
connect-src www.googletagmanager.com

Luego, usa la versión del código del contenedor de Tag Manager intercalado que reconoce el nonce. Establece el atributo nonce en el elemento de secuencia de comandos intercalada con este mismo valor:

<!-- Google Tag Manager -->
<script nonce='{SERVER-GENERATED-NONCE}'>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;var n=d.querySelector('[nonce]');
n&&j.setAttribute('nonce',n.nonce||n.getAttribute('nonce'));f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXX');</script>
<!-- End Google Tag Manager -->

Luego, Tag Manager propagará el nonce a cualquier secuencia de comandos que agregue a la página.

Existen otros enfoques para habilitar la ejecución de una secuencia de comandos intercalada, como proporcionar el hash de la secuencia de comandos intercalada en la CSP.

Si los enfoques de nonce o hash recomendados no son factibles, es posible habilitar la secuencia de comandos intercalada de Tag Manager agregando la directiva 'unsafe-inline' a la sección script-src del CSP.

No se recomienda el uso de 'unsafe-inline'. Debes considerar cuidadosamente las consecuencias de seguridad de agregar esta directiva al CSP antes de usar este enfoque.

Se necesitan las siguientes directivas en el CSP para usar este enfoque:

Directiva	Contenido
script-src	"unsafe-inline" https://www.googletagmanager.com
img-src	www.googletagmanager.com
connect-src	www.googletagmanager.com

Nota: Algunas etiquetas cargan contenido desde otros orígenes o realizan solicitudes a ellos, por lo que requieren el uso de directivas de CSP adicionales para funcionar correctamente.

Variables de JavaScript personalizadas

Debido a la forma en que se implementan las variables de JavaScript personalizadas, se evaluarán como undefined en presencia de un CSP, a menos que se proporcione la directiva 'unsafe-eval' en la sección script-src del CSP.

Para evitar posibles vulnerabilidades de seguridad, usa 'unsafe-eval' solo cuando sea absolutamente necesario.

Directiva	Contenido
script-src	'unsafe-eval'

Nota: Las plantillas personalizadas son la alternativa recomendada a las variables de JavaScript personalizadas. Se pueden usar para crear etiquetas y variables personalizadas que no requieren el uso de 'unsafe-eval'.

Modo de vista previa

Para usar el modo de vista previa de Google Tag Manager, el CSP debe incluir las siguientes directivas:

Directiva	Contenido
script-src	https://googletagmanager.com https://tagmanager.google.com
style-src	https://googletagmanager.com https://tagmanager.google.com https://fonts.googleapis.com
img-src	https://googletagmanager.com https://ssl.gstatic.com https://www.gstatic.com
font-src	Datos de https://fonts.gstatic.com:

Google Analytics 4 (Google Analytics)

Para usar la etiqueta de Google Analytics 4 (Google Analytics), el CSP debe incluir las siguientes directivas:

Directiva	Contenido
script-src	https://*.googletagmanager.com
img-src	https://*.google-analytics.com https://*.googletagmanager.com
connect-src	https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com

En el caso de las implementaciones de Google Analytics 4 (Google Analytics) que usan los indicadores de Google, el CSP debe incluir las siguientes directivas:

Directiva	Contenido
script-src	https://*.googletagmanager.com
img-src	https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD>
connect-src	https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD>
frame-src	https://td.doubleclick.net

Nota: Cada dominio de nivel superior (TLD) de Google se debe especificar de forma individual, ya que la sintaxis de CSP no permite el uso de comodines en el lado derecho del nombre de host. Puedes encontrar una lista de todos los TLD de Google admitidos en https://www.google.com/supported_domains.

Google Ads

Para utilizar una etiqueta de conversión, de remarketing o del Vinculador de conversiones de Google Ads, el CSP debe incluir las siguientes directivas:

Directiva	Contenido
script-src	https://www.googleadservices.com https://www.google.com https://www.googletagmanager.com https://pagead2.googlesyndication.com https://googleads.g.doubleclick.net
img-src	https://www.googletagmanager.com https://googleads.g.doubleclick.net https://www.google.com https://google.com https://www.google.com.<TLD> https://pagead2.googlesyndication.com
frame-src	https://www.googletagmanager.com https://td.doubleclick.net
connect-src	https://pagead2.googlesyndication.com https://www.googleadservices.com https://www.google.com https://google.com

Pixel contador de datos del usuario de Google Ads

Para usar los píxeles contadores de datos del usuario de Google Ads cuando se ejecutan en contextos seguros, el CSP debe incluir las siguientes directivas:

Directiva	Contenido
script-src	https://www.googletagmanager.com
frame-src	https://www.googletagmanager.com
connect-src	https://google.com https://www.google.com

El píxel contador de datos del usuario de Google Ads no se ejecuta en contextos no seguros, por lo que la configuración del CSP en esos casos no es aplicable.

Floodlight

Los usuarios de Floodlight pueden habilitar los CSP con la siguiente configuración. Reemplaza los valores de <FLOODLIGHT-CONFIG-ID> por un ID de anunciante de Floodlight específico o * para permitir cualquier ID de anunciante:

Para todos los usuarios:

Directiva	Contenido
img-src	https://ad.doubleclick.net https://ade.googlesyndication.com https://adservice.google.com https://www.googletagmanager.com
frame-src	https://td.doubleclick.net
connect-src	https://pagead2.googlesyndication.com https://www.google.com https://www.googleadservices.com

Para píxeles contadores de "secuencias de comandos personalizadas":

Directiva	Contenido
frame-src	https://<FLOODLIGHT-CONFIG-ID>.fls.doubleclick.net

Para las etiquetas de imagen:

Directiva	Contenido
img-src	https://ad.doubleclick.net https://ade.googlesyndication.com