Angulartics not tracking at all - javascript

I'm using angulartics for my application to track virtual page views on Google Analytics. This should be enabled by default but no visit to the page is tracked at all.
I should say that I wrapped the Google Analytics js code in a angular directive to be able to turn analytics off on my test server.
Otherwise its pretty standard, I included the angulartics source files in my index.html, added the module to my app.js and removed the ga('send', 'pageview') from the Google Code (as it is described in the docs).
I also found this hard to test. Should I see REST calls in the network console to verify its working? Because I'm not seing any (except the analytics code being loaded from the Google server).
Any idea what I am doing wrong?
Thanks,
Flosky
[edit]I should probably also mention that I'm using the angular ui router and not the default one[/edit]

Related

Google Analytics code is on my site, but invisible

On my website ( https://www.smilinggardener.com/ ), the Google Analytics tracking code isn't visible in the page source code, and Google Search Console can't see it in order to verify my site.
Yet the Google Tag Assistant says it's there, and when I run developer tools and go to 'network', I see the analytics.js file is loaded, and most important, it is tracking visitors.
Any ideas what could be going on?
The analytics code is loaded via an external file.
If you look at your network tab in Chrome there is a column "initiator" (if it isn't there by default you can enable it by clicking the table header and check the respective option). The initiator is the file (if any) that triggered an external dependency.
That in your case the filename contains a complicated id suggests that it is dynamically created by some extension in your CMS.

How to catch 'ga is not defined' in your dev environments

So I have my development environment, and every time I run the project, I have a javascript error in my console:
ga is undefined
Of course I am not at the correct domain so Google Analytics see this as an issue and I am fine with that, but it doesn't allow the rest of my Javascript to run so I have modals and other JS based functionality that stops working.
My thought were I could just write a wrapper method and check for ga undefined. But before I do that I just wanted to see if there was a better solution or possibly different way of thinking about my setup.
Cheers,
Devin
I solved my issue with a method of redefining ga rather than trying to catch the error. In the backend we had logic to only included the Google Analytics script tag if the host url included our domain so when it was localhost or a dev url the script was not included.
So as a resolution I took the answer from this SO question ( Google Analytics Tag for Dev vs. Prod ) and implemented a similar solution in the backend instead and excluded the following code when not our production website domain.
ga('create', 'UA-********-1', 'mywebsite.com');
The result, ga was still defined but does not send data to our Google Analytics account.
Good Luck,
Devin

Test Google Analytics on Localhost

I need to test some custom firing events using Google Analytics. I'd like to test in a local environment.
I've set up my test site using apache with server name: my-ga-test.localhost/
According to Can you test google analytics on a localhost address? and Google Analytics docs, I'm able to adjust my GA code to use:
ga('create', 'UA-XXXX-Y', {
'cookieDomain': 'none'
});
I tried to set up a new account to get a tracking ID for this site, but I'm getting the following error:
URL ends with an invalid top-level domain name
How do I generate the code using localhost domain so I can alter the tracking ID code to put on my localhost?
The "Website URL" field when creating a new Google Analytics property does not have to be the same as the actual URL that's used in production. It's primarily used for resolving relative links, not for validating hits.
Just change it to something else (like example.com), and everything should work fine.
I do not recommend the above answer.
I believe the best practice is to use the Analytics Debug js on your localhost. Debug prints in console EVERYTHING is doing, including firing events. That way you can check if your code is working or not without sending tracking info to Analytics on Localhost (which makes no sense).
Find out more here :)

Google Analytics with SPA (Angular.js)

I've built a SPA website using Angular.js.
How can I configure Google Analytics to identify every page change?
When you deal with SPAs you should avoid firing a pageview when the webpage is loaded in the user's browser because in your Google Analytics reports only the first view will be shown (e.g. index.html). As Google suggests, you should use virtual page views. For Angular specifically, you can do that by dropping the pageview tracking code in your View Router.
If that sounds too complicated, you can take a look at Angularlytics. With a simple configuration and inclusion of the module into your Angular application, all of your views will be tracked automatically.

app.js JavaScript API on Google Drive

I'm investigating Google Drive's real-time API. In the QuickStart Tutorial the JavaScript library loaded is https://apis.google.com/js/api.js. The Drive documentation describes this library as the Google JavaScript API loader. This library seems to load the appropriate libraries for the services we need to interact with.
But when looking at QuickStart Tutorial for Google Drive (non realtime) it seems to load https://apis.google.com/js/client.js which I believe is the library documented here.
My question is what is the difference between api.js and client.js. They seem to have similar purpose although don't work in the same way. Is api.js for certain Google API's while client.js is for others? Is api.js documented somewhere like client.js is?
The content of those two files are (nearly) identical, and in fact it seems you can put any name before .js and it will load the same file. That said, I'd recommend sticking with the file names shown in the documentation, as those are guaranteed to work.
Use links only from the documentation!
Simple to check this:
1) Add to header of your page this script:
<script type="text/javascript" src="https://apis.google.com/js/client.js"></script>
Open DevTools -> Network
I see:
2) Change link to other script
<script type="text/javascript" src="https://apis.google.com/js/api.js"></script>
Open DevTools -> Network
I see:
api.js is the core, when client.js is the module.
Here a completely different content: https://apis.google.com/js/platform.js
Additional information: https://stackoverflow.com/a/33281791/5754223

Categories

Resources