一翠肘、數(shù)據(jù)埋點(diǎn)的說(shuō)明
要想獲取用戶行為信息以及網(wǎng)站使用狀況方式主要有：
1檐束、查看后臺(tái)日志；
2束倍、數(shù)據(jù)埋點(diǎn)被丧；
第一種方式只能獲取很簡(jiǎn)單的數(shù)據(jù)，比如用戶ip绪妹，瀏覽器型號(hào)等甥桂，且可讀性差，主要是用來(lái)給開發(fā)人員看來(lái)找出問(wèn)題的邮旷。要向獲得更詳細(xì)的信息必須進(jìn)行數(shù)據(jù)埋點(diǎn)黄选，而數(shù)據(jù)埋點(diǎn)也有兩種方式：自行設(shè)計(jì)與使用第三方工具
1、自行設(shè)計(jì)
優(yōu)點(diǎn)：（1）控制精準(zhǔn)婶肩，可以非常精確地選擇什么時(shí)候發(fā)送數(shù)據(jù)办陷；（2）可以比較方便地設(shè)置自定義屬性、自定義事件律歼，傳遞比較豐富的數(shù)據(jù)到服務(wù)端民镜。；
缺點(diǎn)：（1）時(shí)間成本高险毁；（2）代價(jià)比較大殃恒，每一個(gè)控件的埋點(diǎn)都需要添加相應(yīng)的代碼植旧，不僅工作量大，而且限定了必須是技術(shù)人員才能完成离唐；（3）病附、更新代價(jià)大，每一次迭代更新都需要考慮之前的代碼亥鬓，工作量大完沪；（4）、設(shè)計(jì)難度高嵌戈，需要設(shè)計(jì)人員有相關(guān)知識(shí)儲(chǔ)備來(lái)明確數(shù)據(jù)如何計(jì)算覆积，學(xué)習(xí)成本比較高；
2熟呛、集成第三方統(tǒng)計(jì)的SDK宽档；
第三方統(tǒng)計(jì)主要有：友盟、百度統(tǒng)計(jì)庵朝、谷歌分析吗冤、Sensors Data、GrowingIO九府、Talking Data等
先說(shuō)一下缺點(diǎn)：能夠覆蓋的功能有限椎瘟，目前并不是所有的控件操作都可以通過(guò)這種方案進(jìn)行定制，但是現(xiàn)在實(shí)現(xiàn)的功能應(yīng)該說(shuō)是可以滿足我們現(xiàn)在以及將來(lái)的需求侄旬；
優(yōu)點(diǎn)：當(dāng)然基本上自行進(jìn)行代碼埋點(diǎn)的缺點(diǎn)就是采用第三方工具的優(yōu)點(diǎn)肺蔚；除此之外還有以下好處：
（1）可視化效果好，它會(huì)直接根據(jù)獲得的數(shù)據(jù)生成表格或者折線圖儡羔，易于閱讀宣羊；
（2）不會(huì)增加網(wǎng)站負(fù)擔(dān)，代碼采用異步加載汰蜘，不會(huì)影響到網(wǎng)站的加載速度仇冯；
（3）擴(kuò)展方式相對(duì)簡(jiǎn)單；
因?yàn)閷?duì)于一個(gè)面向B端的web網(wǎng)站來(lái)說(shuō)鉴扫，并不需要了解用戶太多的數(shù)據(jù)，比如購(gòu)買轉(zhuǎn)化率澈缺、點(diǎn)擊熱點(diǎn)圖坪创、點(diǎn)擊路徑圖等很詳盡的信息，所以綜合上面的優(yōu)缺點(diǎn)姐赡，我們采用了第三方工具莱预，后續(xù)來(lái)說(shuō)如果有需求，我想可以增加一下這些功能项滑，比如：頁(yè)面上下游（記錄訪客的點(diǎn)擊路徑依沮，來(lái)研究顧客的訪問(wèn)習(xí)慣，從而優(yōu)化網(wǎng)站）、頁(yè)面點(diǎn)擊圖（展示頁(yè)面上的點(diǎn)擊熱度）危喉、事件分析（涉及button的點(diǎn)擊等）宋渔、事件轉(zhuǎn)化、時(shí)長(zhǎng)轉(zhuǎn)化辜限、頁(yè)數(shù)轉(zhuǎn)化等皇拣。
二、百度統(tǒng)計(jì)的使用
代碼添加
- 靜態(tài)頁(yè)面: 百度統(tǒng)計(jì)代碼安裝說(shuō)明
- vue-ci項(xiàng)目：
- 在index.html頁(yè)面添加script
#相關(guān)id更換為自己的 var _hmt = _hmt || []; (function() { if (location.origin == 'http://www.baidu.com') { var hm = document.createElement("script"); hm.src = "https://#/hm.js?3274324063ed5dff62d0f75dd10d966b"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); } )();- 在main.js添加代碼
# 邏輯按真實(shí)情況而定 /** 百度統(tǒng)計(jì)薄嫡，檢測(cè)url變化 */ var _hmt = window._hmt || [] router.beforeEach( (to, from, next) => { if (to.path) { if (location.origin == 'http://www.baidu.com') { _hmt.push(['_trackPageview', '/#' + to.path]) } } next() })
??注意：通過(guò)vue添加的代碼不能通過(guò)百度統(tǒng)計(jì)的代碼檢查氧急，請(qǐng)忽視。
