快捷導(dǎo)航

javascript實現(xiàn)用戶點擊數(shù)量統(tǒng)計

更新時間：2016年12月25日 09:38:29 作者：插秧哥

本文主要javascript實現(xiàn)用戶點擊數(shù)量統(tǒng)計的方法進行詳細介紹，具有很好的參考價值，需要的朋友一起來看下吧

在微信上做一次推廣活動，頁面共計三個按鈕，需要分別統(tǒng)計點擊次數(shù)，pc上的相關(guān)統(tǒng)計用的是“百度統(tǒng)計”，因為H5活動頁的時效性等原因，并沒有使用百度統(tǒng)計，而是自己實現(xiàn)一個簡單的統(tǒng)計小方案：前端點擊時請求一個空白小gif圖，帶有參數(shù)，后端同事根據(jù)nginx請求日志做統(tǒng)計，通過在cookie中存入一個不會重疊的時間戳作為key值來區(qū)分是否同一用戶（uv）。

請求的圖片存在七牛中，是固定不變的，主要變化是后面兩個參數(shù)：用戶標識uid和按鈕標識，其中生成不重復(fù)（把重復(fù)率降到最低）的用戶標識很有意思。

時間戳用new Date().getTime()得出一個13位的“隨機數(shù)”，精確到毫秒，但萬一同一毫秒有兩個以上用戶點擊呢？于是再嚴謹一些，用for循環(huán)在隨機一個5位字符串拼接，這樣的重復(fù)率絕對夠用：

uid = new Date().getTime();
var randomNumber = '';
for(var i = 0 ; i < 5 ; i ++){
 randomNumber += new String (Math.floor(Math.random() * 10));
}
uid = uid + randomNumber;

下面是具體邏輯代碼，當網(wǎng)頁中已有請求圖片時，更改url的參數(shù)也一樣能從新發(fā)起一個get請求，避免每次點擊都append一張圖片。這種實現(xiàn)方法感覺比點擊發(fā)送ajax更加方便。

statistics: function(position){
 var pic = "http://wx.daigj.com/notification/statistics/p.gif";
 var uid = util.readCookie("uid");
 var imgLength = $("#statistics-img").length;
 if(uid){
 if(imgLength == 0){
  $('body').append('<img id="statistics-img" src="' + pic + '?uid='+ uid + '&position='+ position +'"/>');
 }else{
  $("#statistics-img").attr("src",pic+"?uid="+uid+"&position="+position);
 }
 }else{
 uid = new Date().getTime();
 var randomNumber = '';
 for(var i = 0 ; i < 5 ; i ++){
  randomNumber += new String (Math.floor(Math.random() * 10));
 }
 uid = uid + randomNumber;
 util.createCookie("uid",uid);
 $('body').append('<img id="statistics-img" src="' + pic + '?uid='+ uid + '&position='+ position +'"/>');
 }
}

以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對大家的學(xué)習或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！

您可能感興趣的文章: