Loading Piwik From CDN

Hello all, I’m having a little trouble loading Piwik from a CDN.

Base Piwik URL: stats.mydomain.com
CDN URL: cdn.cdnprovider.com

I’ve added cdn.cdnprovider.com to the “Trusted Hostnames” settings in General Settings.

I’ve then changed my tracking code to use cdn.cdnprovider.com instead of stats.mydomain.com. All the rest of the Javascript code is the same. Just changed the hostname on the line that reads…


 var u=(("https:" == document.location.protocol) ? "https" : "http") + "://cdn.cdnprovider.com/";

When loading the page, the piwik.js file is loaded and run just fine from the CDN. However, the analytics are not being updated on my server.

Is there anything else/special I need to do? Or does the piwik.js file HAVE to be loaded from the same hostname as the piwik installation?

Of course. I’m assuming the JS tracker is trying to post some data. The CDN hostname will not handle POST data.

So I need to find a way to load the .js file from the CDN hostname then post to the actual Piwik server. At which point, using the CDN might be pointless.

Thanks in advance if anyone has something better for me.

What is the problem? it should “just work” as is…

Thanks for the reply Matt, unfortunately it didn’t work out of the box. I did manage to get it to work with a little tweaking once I looked at what was going on in the Javascript.

Again, my goal is to load the piwik.js file from cdn.cdnprovider.com/piwik.js, this server has no PHP on it much less the Piwik installation. I needed the .js file to be loaded from that server, and still push the tracking data to stats.mydomain.com/piwik.php.

Here is the original code giving by Piwik in the dashboard. This loads and sends the tracking data from the SAME hostname. I needed to load from one and send to another.


<script type="text/javascript">
  var _paq = _paq || [];
  _paq.push(["trackPageView"]);
  _paq.push(["enableLinkTracking"]);

  (function() {
    var u=(("https:" == document.location.protocol) ? "https" : "http") + "://stats.mydomain.com/";
    _paq.push(["setTrackerUrl", u+"piwik.php"]);
    _paq.push(["setSiteId", "1"]);
    var d=document, g=d.createElement("script"), s=d.getElementsByTagName("script")[0]; g.type="text/javascript";
    g.defer=true; g.async=true; g.src=u+"piwik.js"; s.parentNode.insertBefore(g,s);
  })();
</script>

Here is what I ended up having to change it to. The two lines I changed.

The one where we define the variable ‘u’, and the one where we ‘setTrackerUrl’. I explicitly set them to the two separate values I needed and it seems to have worked.


<script type="text/javascript">
	var _paq = _paq || [];
	_paq.push(['trackPageView']);
	_paq.push(['enableLinkTracking']);

	(function() {
		var u=(("https:" == document.location.protocol) ? "https" : "http") + "://cdn.cdnprovider.com/";
		_paq.push(['setTrackerUrl', 'http://stats.mydomain.com/piwik.php']);
		_paq.push(['setSiteId', 1]);
		var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.type='text/javascript';
		g.defer=true; g.async=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
	})();
</script>

Sorry for the double post, but just realized I may as well get rid of the ‘u’ variable altogether. I don’t need https tracking here, so hard coding http will work fine.


<script type="text/javascript">
	var _paq = _paq || [];
	_paq.push(['trackPageView']);
	_paq.push(['enableLinkTracking']);
	
	(function() {
		_paq.push(['setTrackerUrl', 'http://stats.mydomain.com/piwik.php']);
		_paq.push(['setSiteId', 1]);
		var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.type='text/javascript';
		g.defer=true; g.async=true; g.src='http://cdn.cdnprovider.com/piwik.js'; s.parentNode.insertBefore(g,s);
	})();
</script>

Looking good!

Hello;

So you are saying i will upload piwik.js to a CDN (amazon cloudfront)?