Problems settign up Google Analytics

I used this Ember guide (this forum won’t allow me to post the actual URL!!) Adding Google Analytics Tracking - Helpers & Components - Ember Guides and am using the latest GA code. The following is at the bottom of router.js:

Router.reopen({
  notifyGoogleAnalytics: function() {
    return ga('send', 'pageview', {
        'page': this.get('url'),
        'title': this.get('url')
      });
  }.on('didTransition')
});

and the GA code is in index.html:

<script>
      (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', 'OUR_GA_CODE', 'auto');
      ga('send', 'pageview');
 </script>

However, browser Content Security Policy means the app will not load the script, at least when running locally, so “‘ga’ is not defined.”. Following so added Content-Security-Policy metadata <meta http-equiv="Content-Security-Policy" content="script-src 'self' https://www.google-analytics.com/analytics.js; object-src 'self'">.

I’m now getting (in Terminal) Content Security Policy violation: {"csp-report":{"document-uri":"http://localhost:4200/function….

Not sure if this would be the case on the production server. Not sure what to do next.

Finally, the recommendation is to create a .js file with the GA code, should this go into the ‘vendor’ folder (we’re using Ember-cli)?

You’re after unsafe-inline for script-src because of the script tag.

Allows use of inline source elements such as style attribute, onclick, or script tag bodies (depends on the context of the source it is applied to)

1 Like