編輯導(dǎo)語：數(shù)據(jù)埋點(diǎn)是數(shù)據(jù)產(chǎn)品經(jīng)理、數(shù)據(jù)運(yùn)營以及數(shù)據(jù)分析師，基于業(yè)務(wù)需求、產(chǎn)品需求等對(duì)用戶行為的每一個(gè)事件對(duì)應(yīng)的位置進(jìn)行開發(fā)埋點(diǎn)，記錄數(shù)據(jù)匯總后進(jìn)行分析，推動(dòng)產(chǎn)品優(yōu)化或指導(dǎo)運(yùn)營。今天，本文作者和大家聊一聊這次數(shù)據(jù)的誕生：前端埋點(diǎn)。

數(shù)據(jù)埋點(diǎn)是數(shù)據(jù)分析的基礎(chǔ)，依據(jù)埋點(diǎn)數(shù)據(jù)中我們可以開展數(shù)據(jù)清洗、數(shù)據(jù)歸因、分析模型、AB測(cè)試等工作。

如今數(shù)據(jù)分析可以說是當(dāng)前最熱門的技能了，不管是產(chǎn)品、運(yùn)營還是設(shè)計(jì)都可以明顯感知到各大平臺(tái)、公眾號(hào)都在使勁的推送。各種9.9秒殺課程、1元限時(shí)體驗(yàn)。

這說明了數(shù)據(jù)分析確實(shí)是一個(gè)大家都需要掌握的趨勢(shì)，但是我們不能忽視數(shù)據(jù)的生命周期（數(shù)據(jù)的誕生和沉寂），這次聊下數(shù)據(jù)的誕生：前端埋點(diǎn)。

一、什么是埋點(diǎn)？

埋點(diǎn)我們可以理解成一個(gè)收費(fèi)站，用戶的行為就像開著車在高速路上跑。在沒有做埋點(diǎn)的時(shí)候，我們只能知道有人在高速路上跑，但是用戶跑的那條高速路，經(jīng)過了哪些地方，在高速路上遇見了什么問題我們都不知道。

而做了埋點(diǎn)之后，就像我們?cè)诟咚俾飞闲藿ㄊ召M(fèi)站。用戶只要途徑收費(fèi)站，那么我們都會(huì)知曉，這就是埋點(diǎn)。而埋點(diǎn)數(shù)據(jù)則是用戶在經(jīng)過收費(fèi)站時(shí)，我們要想知道的關(guān)于用戶的信息。

除此之外我們也常說埋點(diǎn)我們要分代碼埋點(diǎn)、可視化埋點(diǎn)和全量埋點(diǎn)，那么他們有什么區(qū)別？

1. 代碼埋點(diǎn)

我們請(qǐng)了一個(gè)施工隊(duì)，這個(gè)施工隊(duì)聽你的指揮，并根據(jù)你在高速路上指定的位置建造收費(fèi)站，這種都是一磚一瓦的施工：

• 優(yōu)點(diǎn)：可控性高，滿足所有的需求；
• 缺點(diǎn)：研發(fā)成本、設(shè)計(jì)成本高。

2. 可視化埋點(diǎn)

我們將需要建造的收費(fèi)站進(jìn)行模具化，只需要到指定位置放置模具，對(duì)模具直接澆灌水泥，收費(fèi)站就直接成型。

• 優(yōu)點(diǎn)：操作方面，布置快捷；
• 缺點(diǎn)：適應(yīng)性差，緯度匹配度因“路”而異。

3. 全量埋點(diǎn)

直接組裝衛(wèi)星發(fā)射到天上，實(shí)時(shí)監(jiān)控高速路上的用戶行為。

• 優(yōu)點(diǎn)：用戶的一舉一動(dòng)我們都知曉；
• 缺點(diǎn)：數(shù)據(jù)傳輸量大，數(shù)據(jù)需要二次清洗，占用大量實(shí)時(shí)資源進(jìn)行數(shù)據(jù)傳輸。

二、埋點(diǎn)類型

埋點(diǎn)我喜歡分為前端埋點(diǎn)和后端埋點(diǎn)。前端埋點(diǎn)指的是可視化頁面上的埋點(diǎn)，只要是有可視化操作頁面我們都可以看作是可以進(jìn)行前端埋點(diǎn)。

后端埋點(diǎn)，指的是在用戶看不見也摸不到的后端服務(wù)里進(jìn)行埋點(diǎn)，比如訂單的生成、額的計(jì)算、條件的觸發(fā)等。

在前端埋點(diǎn)中，我們主要關(guān)注用戶行為。用戶在頁面上瀏覽了什么、點(diǎn)擊了什么。這樣我們可以很好的了解頁面內(nèi)容對(duì)于用戶感官的影響。

而后端埋點(diǎn)更加看重業(yè)務(wù)和邏輯，在用戶發(fā)起行為交互后，對(duì)交互數(shù)據(jù)進(jìn)行記錄。例如：搜索的內(nèi)容是什么,搜索到的結(jié)果怎么樣等，由此得到數(shù)據(jù)后，我們可以更好優(yōu)化“策略”。

三、前端埋點(diǎn)：自動(dòng)觸發(fā)式

1. PV

前端埋點(diǎn)我們常用的就是PV/UV（Page View / User View；頁面瀏覽量 / 用戶瀏覽量）。他們兩個(gè)區(qū)別在于，PV（頁面瀏覽量）關(guān)注的是頁面被瀏覽的次數(shù)，打開一次計(jì)算一次。

UV（用戶瀏覽量）關(guān)注的是瀏覽用戶的數(shù)量，記錄打開瀏覽的用戶數(shù)量。了解上面PV/UV的最基本認(rèn)知之后，我們來討論如何做好PV/UV的記錄？

我們常識(shí)中PV/UV就只是給技術(shù)提埋點(diǎn)數(shù)據(jù)需求（文檔、口頭）就完了，其實(shí)我們?cè)谔酨V埋點(diǎn)的時(shí)候有很多細(xì)節(jié)。

一般頁面會(huì)存在生命周期，這種生命周期常見有4個(gè)階段，以VUE（國內(nèi)用的比較多的前端研發(fā)框架）為例分別是：創(chuàng)建、加載、更新、銷毀，這4個(gè)階段分別代表著用戶在點(diǎn)擊打開瀏覽網(wǎng)頁到點(diǎn)擊關(guān)閉退出網(wǎng)頁。

正常情況下用戶進(jìn)入頁面，先渲染一些簡單的樣式（html和css），隨后便進(jìn)行數(shù)據(jù)的加載更新，最后用戶點(diǎn)擊關(guān)閉退出頁面，如果我們?cè)偌?xì)分可以分為創(chuàng)建前、創(chuàng)建后、載入前、載入后、更新前、更新后、銷毀前、銷毀后。

在我們進(jìn)行PV/UV埋點(diǎn)的時(shí)候，就算相同的一個(gè)緯度（PV/UV）選擇不同的階段進(jìn)行埋點(diǎn)，得到的結(jié)果也會(huì)不一樣。正常情況下，技術(shù)喜歡把埋點(diǎn)做在加載，更新這2個(gè)階段。這樣需要用戶基本完整的看見也看才進(jìn)行埋點(diǎn)數(shù)據(jù)的存儲(chǔ)（才會(huì)觸發(fā)埋點(diǎn)）。

但是在特殊情況下，有些用戶網(wǎng)絡(luò)情況不佳，半天都加載不出頁面，遇見我們常說的白屏，這樣PV的觸發(fā)將會(huì)有不可控性。

因?yàn)槲覀兒茈y知道因?yàn)榫W(wǎng)絡(luò)的問題，他到底觸沒觸發(fā)我們的埋點(diǎn)。所以在這樣的情況下，我們可以將PV的觸發(fā)放在“創(chuàng)建”這個(gè)位置，當(dāng)頁面創(chuàng)建成功機(jī)會(huì)進(jìn)行埋點(diǎn)數(shù)據(jù)的觸發(fā)。

下面是pv埋在不同階段會(huì)有不同的特點(diǎn)，但是常態(tài)下我們都還是選擇放在更新這個(gè)階段：這只是依據(jù)頁面的生命周期的鉤子（頁面運(yùn)行時(shí)，前端代碼加載的先后順序）進(jìn)行說明。可能存在誤差，有需要的可以自行去百度vue生命周期。

2. UV

UV和PV埋點(diǎn)的方式相同，唯一不同的地方就是UV需要在PV的基礎(chǔ)上通過唯一標(biāo)示進(jìn)行篩選。統(tǒng)計(jì)有多少個(gè)唯一標(biāo)示而得UV的數(shù)量，一般我們常見的唯一標(biāo)示如下：

1. 手機(jī)號(hào)：用戶登錄頁面后依據(jù)他綁定的手機(jī)號(hào)來進(jìn)行統(tǒng)計(jì)，但是如果用戶未登錄將無法統(tǒng)計(jì)；
2. cookie：通過用戶瀏覽器上的cookie作為唯一標(biāo)示，但因?yàn)閏ookie是存在用戶瀏覽器中容易被修改；
3. localStorage：通過在瀏覽器在本地存儲(chǔ)一個(gè)長期唯一標(biāo)示，但是可以手動(dòng)清理；
4. IP:通過訪問頁面ip地址進(jìn)行區(qū)分，如果ip變更將另行計(jì)算；
5. seesionStorae：通過存在服務(wù)器的信息進(jìn)行表示，有實(shí)效性。

這5個(gè)就是我們常用作為UV唯一標(biāo)示的，他們推薦使用的優(yōu)先級(jí)手機(jī)>ip>local>cookie>seesion。

推薦使用手機(jī)號(hào)是因?yàn)?，?dāng)我們擁有自己的賬戶體系的時(shí)候，使用手機(jī)號(hào)作為標(biāo)示這樣可以更好的和我們自身數(shù)據(jù)進(jìn)行關(guān)聯(lián)。但這樣面臨的問題將是需要用戶進(jìn)行登錄，在一些宣傳h5頁面上，使用登錄將顯得格外繁瑣，因此衍生出使用ip作為唯一標(biāo)示。

ip我們大家都知道，會(huì)跟著你的網(wǎng)絡(luò)變化而變化，那么按道理也是不準(zhǔn)的，為什么反而在local前面了（local：網(wǎng)站在瀏覽器本地存的一個(gè)信息，具有唯一性，能手動(dòng)清理，清理后生成的將不再是原來的）？

因?yàn)閘ocal雖好，但因?yàn)榇蟛糠质謾C(jī)瀏覽器不支持，或者是部分支持這樣數(shù)據(jù)采集又會(huì)不全，所以退而求次使用ip。

四、擴(kuò)展

在大多數(shù)情況下，大部分公司都沒健全的數(shù)據(jù)埋點(diǎn)體系，有個(gè)pv和uv就不錯(cuò)了。面對(duì)這樣情況我們就去深挖他們的價(jià)值，通過對(duì)他們的簡單應(yīng)用，實(shí)現(xiàn)對(duì)我們大膽猜測(cè)的依據(jù)。

1. 轉(zhuǎn)化率

通過代碼埋點(diǎn)或是全量埋點(diǎn)，將關(guān)鍵業(yè)務(wù)涉及頁面進(jìn)行埋點(diǎn)覆蓋，使用下個(gè)頁面pv/uv量除上個(gè)頁面pv/uv量我們就可以得出頁面之間的轉(zhuǎn)化率。

比如：有ab兩個(gè)頁面，點(diǎn)擊a頁面才會(huì)進(jìn)入b頁面?，F(xiàn)有100個(gè)pv/uv被a頁面進(jìn)行統(tǒng)計(jì)，當(dāng)在b頁面時(shí)統(tǒng)計(jì)時(shí)候，出現(xiàn)了120個(gè)pv/uv，將這120個(gè)pv/uv與a頁面的進(jìn)行對(duì)比，出現(xiàn)有90個(gè)pv/uv相互重復(fù)（交集），最后用b頁面相互重復(fù)的90個(gè)pv/uv除以a頁面這100pv/uv，得出他們之間的轉(zhuǎn)化率為90%（90/100=0.9）。

2. 停留時(shí)間

如果只是pv/uv其實(shí)應(yīng)用面會(huì)很少，那么我們就需要在頁面的四個(gè)階段中做其他的類似pv/uv的埋點(diǎn)，只不過是用戶記錄時(shí)間。

當(dāng)頁面創(chuàng)建（用戶訪問網(wǎng)站或頁面）時(shí)，我們可以將出發(fā)pv/uv的時(shí)間進(jìn)行存儲(chǔ)。而當(dāng)用戶正常離開頁面時(shí)，我們?cè)俅斡涗洉r(shí)間，后者減去前者我們就得到了停留時(shí)間。

但是需要我們注意的是，用戶很少按照我們?cè)O(shè)計(jì)的流程執(zhí)行。在app中會(huì)出現(xiàn)用戶直接退出整個(gè)應(yīng)用，這樣會(huì)讓數(shù)據(jù)存在差異。也有用戶使用app將頁面常掛手機(jī)后臺(tái)，這樣數(shù)據(jù)也會(huì)出現(xiàn)差異。

同時(shí)在小程序（微信小程序）上使用停留時(shí)間的埋點(diǎn)，會(huì)因?yàn)槲⑿判〕绦虻奶匦詿o法關(guān)閉，后臺(tái)執(zhí)行出現(xiàn)差異。所以我們要警惕那些差異性很大的數(shù)據(jù)，將他們剔除，放置在其他數(shù)據(jù)中將是一個(gè)好方法。

五、前端埋點(diǎn)：互動(dòng)式

除了依據(jù)用戶瀏覽行為進(jìn)行自動(dòng)式觸發(fā)的埋點(diǎn)（不絕對(duì)）pv/uv外，我們還有一種埋點(diǎn)方式需要用戶參與互動(dòng)。

常見的是用戶進(jìn)行按鈕的點(diǎn)擊和頁面的滑動(dòng)。我們通過對(duì)按鈕計(jì)數(shù)（pv）和去重（uv），這樣我們可以了解這個(gè)功能按鈕的使用情況，這樣也就能夠支撐我們進(jìn)行一些小功能簡單的ab測(cè)試。

又或者我們與用戶的滑動(dòng)行為結(jié)合起來埋點(diǎn)。技術(shù)可以通過監(jiān)聽用戶滑動(dòng)位置，來決定是否觸發(fā)埋點(diǎn)，這也是我們常說的曝光埋點(diǎn)。

曝光埋點(diǎn)：這種埋點(diǎn)一般常用戶商品、內(nèi)容的推薦上。當(dāng)我們?cè)O(shè)置推薦的商品或內(nèi)容在首屏上時(shí)，同時(shí)用戶首次進(jìn)入頁面，那我們可以根據(jù)自身業(yè)務(wù)選擇使用pv或uv做作他們的曝光量，但是這僅限固定商品和內(nèi)容。

這樣對(duì)于多個(gè)商品進(jìn)行輪播曝光時(shí)，會(huì)因?yàn)樯唐返妮啿C(jī)制難以確認(rèn)單個(gè)商品的曝光量，所以一般我們?cè)趯?duì)于多個(gè)商品進(jìn)行輪播曝光時(shí)，暫時(shí)都只統(tǒng)計(jì)這個(gè)輪播模塊的曝光量。

而對(duì)于模塊中的商品我們常用曝光轉(zhuǎn)化率來看。計(jì)算方式有點(diǎn)像輪播圖的計(jì)算方式，單個(gè)商品點(diǎn)擊量（按鈕pv/uv）/整體模塊曝光量（pv/uv）= 單個(gè)商品的轉(zhuǎn)化率。

這種使用頁面的pv/uv來作為計(jì)算模塊和商品曝光量的方式，僅限在首屏上固定曝光的模塊。如果計(jì)算曝光量的模塊或商品不在首屏上，那么我們使用這樣但方式是不科學(xué)、不可取的。

我們就需要結(jié)合用戶的滑動(dòng)屏幕來觸發(fā)曝光埋點(diǎn)，當(dāng)用戶滑動(dòng)到什么位置，就可以看見這個(gè)模塊時(shí)，我們才在看見模塊的同時(shí)觸發(fā)埋點(diǎn)。

這個(gè)時(shí)候，我們可以考慮是使用觸發(fā)次數(shù)（pv）還是觸發(fā)人次（uv）來進(jìn)行計(jì)算。

六、前端埋點(diǎn)：自動(dòng)觸發(fā)式+互動(dòng)式

埋點(diǎn)的觸發(fā)和互動(dòng)，數(shù)據(jù)的次數(shù)和人次（pv/uv）基本上算前端埋點(diǎn)的兩個(gè)核心，將他們兩個(gè)結(jié)合起來，我們可以擴(kuò)展很多的分析維度，比如我們常用的購買路徑分析、跳出率等。

這里我只是簡單的講了我們單純埋個(gè)點(diǎn)，每次觸發(fā)只是記錄用戶信息和次數(shù)。其實(shí)我們還可以記錄商品信息，這樣我們可以觀察什么商品更受喜歡。記錄金額，可以了解什么價(jià)位更符合用戶預(yù)期等。

文章到這里就暫時(shí)結(jié)束，后面有機(jī)會(huì)我在和大家談一談后端埋點(diǎn)。

作者：wcof，在努力做產(chǎn)品不做產(chǎn)品經(jīng)理的人；微信公眾號(hào)：Wcof（ID：wcofPM）

本文由 @Wcof 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載

題圖來自Unsplash，基于CC0協(xié)議。