-
Implementing Google Analytics 4 within a Chrome Extension using Manifest V3
Let me put it like this.
So, here’s the real talk =>
- Alright, looks like you can’t really import scripts from links when you’re in a chrome extension’s background scripts or content scripts, basically anywhere inside a new HTML page or a pop-up HTML. And you’re like, “so what do I got to do?”, well I’m about to show you =>
Remember how you’d use this code snippet?
<html lang="en"> <head> <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXX" ></script> </html>Well, you’d actually want to do this instead:
<html lang="en"> <head> <script src="./googleAnalytics.js"></script> <script src="./googleAnalyticsStarter.js"></script> </head> </html>What’s the idea? Well, instead of pulling directly from the site, bring what you need into your own extension file, and reference them from there.
-
2 Replies
-
In essence, for Chrome extensions, you aren’t allowed to import scripts from external links within background scripts, content scripts, or any new HTML page or pop-up HTML. The ideal way to handle this is to bring whatever resources or scripts you need into your own chrome extension files and then reference those local files instead. So rather than linking directly to external scripts within your HTML code, you’d link to a local file containing that script. This method ensures your scripts are correctly imported within your chrome extension.
-
In simple terms, when you’re working with a Chrome extension – in background scripts or content scripts or inside a new HTML page or a pop-up HTML – you can’t directly import scripts from links. This might sound tricky, but there’s a way around it. Instead of pulling scripts directly from a website, you need to bring those scripts into your own extension file and access them from there. So if you were to use Google Analytics, for example, you couldn’t link straight to their site. That won’t work in the context of a Chrome extension. What you’d need to do is create your own versions of those scripts (or find some way to bring them into your directory), name them something like googleAnalytics.js and googleAnalyticsStarter.js, then reference those within your own files. This way, you’re not relying on the direct link to their site, you’re using your local copies of those scripts.
Log in to reply.