輕量的 Google Analytics

發表於 分類於

Google Analytics 是個很知名的網頁資料分析工具，加入到網頁的方法也很簡單，只需要貼上幾個 <script> 到 html 中就好了。不過對於一些有對自己網站使用一些檢測工具的人來說可能會發現這其實是個效能殺手，主要是它 Headers 中的快取時間很短，而腳本大小又蠻大的

對此，我之前就有想過到底要不要放 Google Analytics 在目前這個網頁上，一方面是想知道訪客主要都瀏覽哪些文章，但又不想讓這個網頁太過肥大、緩慢。後來經過我的一些研究後，發現原來 Google Analytics 有提供 api 讓使用者發送統計資料，不需要官方的 script 就能運作了

用 Measurement Protocol 來發送資訊

Measurement Protocol 是 Google Analytics 提供的 api，可供使用者手動發送一些統計資料

使用方法就是發送一個 POST(推薦) 或 GET 請求到 https://www.google-analytics.com/collect 就好了

例如下面這個是此網頁發送資訊給 Google Analytics 的 code:

1
2
3
4
5
6
7
8
9
var uid = localStorage.getItem('uid') || (Math.random() + '.' + Math.random())
localStorage.setItem('uid', uid)
$.post('https://www.google-analytics.com/collect', {
	v: 1,
	tid: 'UA-xxxxxxxxx-x',
	cid: uid,
	t: 'pageview',
	dp: encodeURIComponent(location.pathname)
})

裡面的參數分別是:

  • v: api protocol 版本的編號，目前只有 1 能用而已
  • tid: 一般使用 GA 時會用到的 UA-xxxxxxxxx-x 編號
  • cid: 一個獨一無二的 ID，用來辨識使用者的
  • t: 資訊的種類，如 pageview 是指網頁瀏覽，全部的種類可以參考這邊
  • dp: 指網址的 path 部分，不含 hostname querystring 之類的部分

這些參數可以根據自己的需求與 Parameter Reference 中寫的去修改，像我只用這些參數是因為我也只需要知道這些

關於廣告阻擋器

有些人可能會在想這會不會被廣告阻擋器阻擋，答案是肯定的，因為資訊的傳送目標是 www.google-analytics.com，所以這基本上會被絕大多數的 adblocker 所阻擋

當然有人可能會想可以弄個 reverse proxy 架在自己的伺服上，把 /collect 的 url 改到自己的 server 然後把真實 ip 加到 uip 參數去再傳給 GA 的伺服器，理論上這應該可行(我沒試過)，但我認為沒必要硬去收集不想被收集資料的人的資料