0

I'm developing a Chrome Extension and want to use GA4 for analytics.

My manifest.json (v2) contains the following:

 "background": {
    "scripts": ["src/bg/background.js", "src/bg/ga4.js"],
    "persistent": true
  },

"content_security_policy": "script-src 'self' https://www.googletagmanager.com; object-src 'self'"

In ga4.js, I have the following:

var script = document.createElement('script'); script.type = 'text/javascript'; script.async = true;
script.src = 'https://www.googletagmanager.com/gtag/js?id=G-*******';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(script, s);

window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'G-******');

However, the following error persists:

Refused to load the script 'https://www.googletagmanager.com/gtag/js?id=G-******' because it violates the following Content Security Policy directive: "script-src 'self' blob: filesystem:". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

I've tried using a background HTML page and adding the script snippet from GA4 to the <head> tag, but using a background page instead of script breaks the extension

How do I get around CSP?

Emri99
  • 1
  • Try `script-src-elem` instead of `script-src` in manifest.json. Try adding `https://www.googletagmanager.com/` to `permissions` in manifest.json. – wOxxOm Mar 29 '23 at 18:27

0 Answers0