Trying to add Google Analytics to Chrome Extension

Question

I have looked through several other posts about adding GA to my chrome extension but have had no luck yet.

So far this is my analytics code

analytics.js

(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
    
    ga('create', 'UA-XXXXXXX-Y', 'auto');
    ga('send', 'pageview');

And of course, I have already added my GA ID.The main error I keep getting is

analytics.js:3 Refused to load the script 'https://www.google-analytics.com/analytics.js' 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.

In reference to the tutorial, I have added the following to my manifest.json manifest.json

  "content_security_policy": "script-src 'self' https://ssl.google-analytics.com; object-src 'self'",

However, even after adding this to my extension, I keep getting the error in my dev console.

For reference, here is the script in my index.html

<html lang="en">
  <head>
    <title>Polus</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <link rel="shortcut icon" type='image/png' href="images/polus_tab_icon.png"/>
    <link rel="stylesheet" type="text/css" media="screen" href="./css/calendar-style.css"/>

    <script type="text/javascript" src="./js/analytics.js"></script>

  </head>

Please help if possible!

Дмитро Булах · Accepted Answer · 2020-09-11 09:53:11Z

2

your content policy declaration in manifest.json doesn't work since it refers to the different domain than www.google-analytics.com. Also, to use Universal Analytics script analytics.js you'd also need to adjust settings to disable protocol check. Take a look at this tutorial https://davidsimpson.me/2014/05/27/add-googles-universal-analytics-tracking-chrome-extension/

answered Sep 11, 2020 at 9:53

Дмитро Булах

3,8381 gold badge17 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

pythonNovice Over a year ago

Thank you for your help! In addition to this, I realized that after changing the manifest I needed to reload my extension.

David Dehghan · Accepted Answer · 2022-03-23 23:34:46Z

1

By the way Google Analytics 4 (gta.js) has not implemented the checkProtocolTask. So for the time being tacking Google Extensions with GA4 is not going to work. See https://issuetracker.google.com/issues/174954288?pli=1 for the latest status

answered Mar 23, 2022 at 23:34

David Dehghan

25.3k11 gold badges113 silver badges101 bronze badges

Collectives™ on Stack Overflow

Trying to add Google Analytics to Chrome Extension

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related