1.數據分析的概念、分類javascript
數據分析系統的主要功能是從衆多的外部系統中,採集相關的業務數據,集中存儲到系統的數據庫中。系統內部對全部的原始數據經過一系列的處理轉換以後存儲到數據倉庫的基礎庫中;而後根據業務須要進行一系列的數據轉換到相應的數據集市,供其餘數據應用組件進行專題分析或者展現。前端
數據倉庫和數據集市的區別:https://student-lp.iteye.com/blog/2211473java
根據數據的流轉流程,通常會有如下幾個模塊:數據採集、數據存儲、數據計算、數據分析、數據展現等待。固然也會有在這基礎上進行相應變化的系統模型。ajax
按照數據分析的時效性,將數據分析分爲實時分析和離線分析兩種。實時分析是在時效上有強烈的保證,數據是實時流動的,相應的分析狀況也是實時的。而離線分析更多的是對已有的數據進行分析,失效性的要求略低。失效性的標準都是以人能夠接收的程度來劃分的。數據庫
2.數據採集原理分析windows
當用戶訪問頁面時,瀏覽器對頁面進行加載,同時也會觸發頁面中的埋點。後端
埋點是指:在網頁中預先加入一小段javascript代碼,這個代碼片斷會動態的建立一個script標籤,並將src屬性指向一個單獨的js文件,此時這個單獨的js文件(下圖中的綠色節點)會被瀏覽器請求並執行,這個js文件實際上就是真正的前端數據採集腳本。跨域
數據收集完成之後,js會請求一個後端的數據收集腳本(下圖中的backend),這個腳本通常是一個假裝成圖片的動態腳本程序,js會將收集到的數據經過http參數的方式傳遞給它,後端收集腳本解析http參數,並按照固定的格式記錄到訪問日誌,同時可能會在http響應中給客戶種植一些用於追蹤的cookie,並返回一個1*1像素的圖片。整個採集過程,對於用戶是透明的。數組
3、數據採集系統的設計實現瀏覽器
根據原理分析並結合Google Analytics,想搭建一個用戶行爲數據採集系統,要完成如下幾件事情:
1.前端開發
2.後端開發
3.集成測試
4、肯定須要採集的信息
數據主要來源於Web服務器和前端頁面:
5、編寫埋點代碼
埋點是網站分析的一種經常使用的數據採集方法。核心就是在進行數據採集的關鍵點植入統計代碼,進行數據的採集。如下代碼爲谷歌分析系統(Google Analytics)的埋點代碼:
拓展知識:js自調用匿名函數
格式:(function(){})();
紅色括號向腳本返回匿名函數,藍色括號表示當即執行紅色括號返回的匿名函數。
自調用匿名函數的好處:
避免重名,自調用匿名函數只會運行一次,通常用於初始化。
6、前端數據收集腳本的編寫
前端數據收集腳本就是埋點代碼中的匿名函數引入並建立在被統計頁面的節點樹中的外部js文件:ma.js。
數據收集通常要完成如下幾個事情:
1.經過瀏覽器內置對象收集信息:如頁面的標題(document.title)、前一個頁面的url(document.referer)、用戶顯示器分辨率(windows.screen)、cookie信息(document.cookie)等等。
2.解析_maq收集用戶自定義信息,包括用戶自定義的事件跟蹤、業務數據(如商品編號、商品價格等)
3.將以上兩步收集的數據按預約格式解析並拼接。
4.請求後端數據收集腳本,將信息放在http request參數中攜帶給後端腳本。
關於步驟4的說明:
js請求後端腳本的方法一般是ajax,可是aja不能實現跨域請求。ma.js是在被統計的網站的域內執行,然後端腳本是在另外一個域中。所以,在步驟4中不能經過ajax的方式來請求後端數據收集腳本。
另外一種可行的辦法是:在js腳本中建立一個image對象,將image對象的src屬性指向後端腳本並攜帶參數,實現跨域請求後端。這也是後端腳本爲何一般假裝成gif文件的緣由。
<script> (function () { var params ={}; // Document對象數據
if(document) { params.domain = document.domain || ''; // 主機名稱
params.url = document.url || ''; // url
params.title = document.title || ''; // 網頁標題
params.referer = document.referrer || ''; // 上一個頁面
} // Window對象數據
if (window && window.screen) { params.sh = window.screen.height || 0; // 頁面高度
params.sw = window.screen.width || 0; // 頁面寬度
params.cd = window.screen.colorDepth ||0; // 頁面顏色深度
} // navigator對象數據
if (navigator) { params.lang = navigator.language || ''; // 頁面語言
} // 解析_maq數組數據
if (_maq) { // 遍歷-maq數組
for (var i in _maq) { switch (_maq[i][0]) { case '_setAccount': params.account = _maq[i][1] // 網站訪客的帳號
break; default: break; } } } // 拼接參數串
var args = ''; for (var i in params) { if (args != '') { args += '&'; // 每一個參數後添加&
} args += i + '=' + encodeURIComponent(params[i]); } // 經過Image對象請求後端腳本
var img = new Image(1,1); // 建立像素爲1*1的
img.src = 'http://xxx.xxxx.xxx/log.gif?' + args; })(); </script>