Google Analytics Tracking for CDN #568
Conversation
I ended up just manually minifying and adding the pixel to the build script, but here's the original notes on the url pieces that I made. /** * Google Analytics tracking pixel for the freely hosted version of Video.js * at vjs.zencdn.net. We'll use this data to develop a support matrix of * browsers and devices. * * This code generates the GA tracking URL without requiring the GA javascript * library. * * @type {Image} */ ;(function(img){ img.src = '//www.google-analytics.com/__utm.gif' + '?utmwv=5.4.2' // Version + '&utmac=UA-16505296-2' // ID // &utms=2 // Sessions + '&utmn='+Math.floor(Math.random() * 10000000000) // Cache breaker + '&utmhn='+encodeURIComponent(window.location.hostname) // &utmcs=UTF-8 // Encoding + '&utmsr='+window.screen.availWidth+'x'+window.screen.availHeight // &utmvp=1057x1105 // Browser window // &utmsc=24-bit // Color depth + '&utmul='+ (navigator.language || navigator.userLanguage) // &utmje=1 // Java // &utmfl=11.7%20r700 // Flash version // &utmdt=HTML5%20Video%20Player%20%7C%20Video.js // Page title // &utmhid=1112291628 // Adsense // + '&utmr='+(document.referrer || '-') // Referrer, '-' is none + '&utmp='+encodeURIComponent(window.location.pathname) // &utmht=1370890439353 // ? // &utmcc=__utma%3D59332138.2144546446.1350079499.1369781272.1370890430.57%3B%2B__utmz%3D59332138.1368060482.49.3.utmcsr%3Dlocalhost%3A8080%7Cutmccn%3D(referral)%7Cutmcmd%3Dreferral%7Cutmcct%3D%2F%3B // Cookies // &utmu=q // ? ; })(new Image());
| // Add CDN-specfic JS | ||
| jsmin = grunt.file.read('dist/cdn/video.js'); | ||
| // GA Tracking Pixel (manually building the pixel URL) | ||
| jsmin += ';(function(i,w,n,e,l){l=w.location;i.src="//www.google-analytics.com/__utm.gif?utmwv=5.4.2&utmac=UA-16505296-2&utmn="+Math.floor(Math.random()*10e9)+"&utmhn="+e(l.hostname)+"&utmsr="+w.screen.availWidth+"x"+w.screen.availHeight+"&utmul="+(n.language||n.userLanguage)+"&utmp="+e(l.pathname);})(new Image(),window,navigator,encodeURIComponent);'; |
There was a problem hiding this comment.
Should this render inside the VJS function (as a callback maybe)? I'm worried this will cause issues if the DOM isn't loaded. Also, the Image tag may need to be hidden so an invisible 1x1 GIF doesn't throw off the page it's rendered on...
There was a problem hiding this comment.
The image element never gets added to the DOM actually, so, it shouldn't ever show up. So, I don't think it would matter if the DOM is loaded actually.
For some reason, image elements send off the request for the image as soon as their src is set.
|
I'm not sure if this specific version of google analytics can do it, but I know that you can call GA with whatever data you want. Might be cool to aggregate data about what API methods are used and what plugins get loaded. |
|
(If you look at the commit comment you can see a little bit more spelled out version of the code) @mchristopher Yeah, the new image just gets created in memory and is never inserted into the DOM like @gkatsev said. Not sure why it still loads the src, but it works in the browsers I've checked, including IE8. @gkatsev That would be pretty cool. Just tracking the video.js version would be especially useful to track, and easy to add to the URL. If you can find any more info on that let me know. We should probably avoid beefing this up too much with analytics, so the more we can do things in just the initial image request the better. |
|
If you add "&utme=8(vjsv)9(1.0.0)" (where vjsv is the variable name and 1.0.0 is the VJS version) you should be able to get the VJS version aggregated. Aside from that, the code looks good to me. |
|
Need to add "&utmcc=__utma%3D1.190133879.1.1.1.1%3B" where "190133879" should be generated by Math.floor(Math.random()*10e9), and utmn should be set to 1. |
Added cdn.js so we can actually have notes around the analytics code
|
Ok, I think this is good to go. Gonna pull in. |
This adds a tracking pixel to the CDN verion (only) so we can track things like device usage to build a support matrix from.