CSP for Google Analytics, Hotjar and Third-Party Scripts

Marketing and analytics scripts are the hardest part of getting CSP right. They load from multiple subdomains, inject inline scripts, and make API calls — each requiring separate CSP entries. Here are the exact directives for the most common services.

Google Analytics 4 (GA4)

script-src 'self' https://www.googletagmanager.com https://www.google-analytics.com;
connect-src 'self' https://www.google-analytics.com https://analytics.google.com https://region1.google-analytics.com;
img-src 'self' https://www.google-analytics.com https://www.googletagmanager.com;

Hotjar

script-src 'self' https://static.hotjar.com https://script.hotjar.com;
connect-src 'self' https://*.hotjar.com https://*.hotjar.io wss://*.hotjar.com;
img-src 'self' https://*.hotjar.com;
font-src 'self' https://static.hotjar.com;

Intercom

script-src 'self' https://widget.intercom.io https://js.intercomcdn.com;
connect-src 'self' https://api.intercom.io https://api-iam.intercom.io wss://nexus-websocket-a.intercom.io;
img-src 'self' https://static.intercomassets.com https://downloads.intercomcdn.com;
frame-src 'self' https://intercom-sheets.com;

Stripe.js

script-src 'self' https://js.stripe.com;
frame-src 'self' https://js.stripe.com https://hooks.stripe.com;
connect-src 'self' https://api.stripe.com;

HubSpot

script-src 'self' https://js.hs-scripts.com https://js.usemessages.com https://js.hscollectedforms.net;
connect-src 'self' https://api.hubspot.com https://forms.hubspot.com;
img-src 'self' https://track.hubspot.com;

reCAPTCHA v3

script-src 'self' https://www.google.com/recaptcha/ https://www.gstatic.com/recaptcha/;
frame-src 'self' https://www.google.com/recaptcha/;
connect-src 'self' https://www.google.com/recaptcha/;

Partytown — the better approach for analytics

Instead of allowlisting all these domains, you can run third-party scripts in a Web Worker using Partytown. They execute off the main thread, improve performance, and simplify your CSP:

<!-- Replace your GA4 script type with text/partytown -->
<script type="text/partytown" src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX"></script>
<script type="text/partytown">
  window.dataLayer = window.dataLayer || [];
  function gtag(){ dataLayer.push(arguments); }
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXX');
</script>

<!-- Partytown loader -->
<script>partytown = { forward: ['dataLayer.push'] };</script>
<script src="https://cdn.jsdelivr.net/npm/@builder.io/partytown/partytown.js"></script>