Refused to load the script 'https://www.googletagmanager.com/gtag/js

Uday prasad

unread,

Sep 15, 2022, 5:19:59 AM9/15/22

to Chromium Extensions

I am trying to create chrome extension v3 with existing reactjs and typescript project.

manifest.json :

{
"name": "Sample project",
"description": "Sample Chrome extension",
"version": "1.0",
"manifest_version": 3,
"action": {
"default_popup": "index.html",
"default_title": "Open the popup"
}
}

'public/index.html':

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/logo.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="sample app" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo.svg" />
<link
href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
rel="stylesheet"
/>
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<title>%REACT_APP_TITLE%</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>

When I click the extension in developer mode the following errors are generated:

Refused to load the script 'https://www.googletagmanager.com/gtag/js?l=dataLayer&id=G-KJFKE93ST6' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
Refused to load the script 'https://www.googletagmanager.com/gtag/js?l=dataLayer&id=G-KJFKE93ST6' because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
Uncaught NotFoundError: URL not found: /index.html

Project consists of google analytics.

What might be the cause and necessary changes need to be done?

PhistucK

unread,

Sep 15, 2022, 7:22:34 AM9/15/22

to Uday prasad, Chromium Extensions

Starting with the last error, you put your index.html in the public folder, but your manifest says it is on the root folder, so prepend public/ to the default_popup value.

Regarding the other errors, nothing in the code you shared points to loading anything external (or even an internal script, which is weird considering the content of the file), so I guess something in your TypeScript code is trying to load Google Tag Manager and you omitted the (internal) script from the HTML you shared here.

Note that you cannot load anything external (like Google Tag Manager from that URL) in your normal extension pages/popups.

If you need to load Google Tag Manager, you will have to use a sandbox/webview/similar (not so familiar with the options, sorry).

☆PhistucK

--
You received this message because you are subscribed to the Google Groups "Chromium Extensions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-extens...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/d7c5272d-2a71-48d0-8ebb-aa1f2e73d9f7n%40chromium.org.

Uday prasad

unread,

Sep 15, 2022, 10:05:18 AM9/15/22

to Chromium Extensions, PhistucK, Chromium Extensions

Regarding default_popup value what you have mentioned was correct. Thanks for the input.

Reply all

Reply to author

Forward