Problems settign up Google Analytics


#1

I used this Ember guide (this forum won’t allow me to post the actual URL!!) guides.emberjs.com/v1.10.0/cookbook/helpers_and_components/adding_google_analytics_tracking/ 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)?


#2

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

https://developer.chrome.com/extensions/contentSecurityPolicy#relaxing-inline-script

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)