摘要:通過(guò)分析用戶(hù)的行為，才想得到為什么會(huì)出現(xiàn)這種情況！

堅(jiān)守“ 做人真誠(chéng) · 做事靠譜 · 口碑至上 · 高效敬業(yè) ”的價(jià)值觀，專(zhuān)業(yè)網(wǎng)站建設(shè)服務(wù)10余年為成都成都履帶攪拌車(chē)小微創(chuàng)業(yè)公司專(zhuān)業(yè)提供成都定制網(wǎng)頁(yè)設(shè)計(jì)營(yíng)銷(xiāo)網(wǎng)站建設(shè)商城網(wǎng)站建設(shè)手機(jī)網(wǎng)站建設(shè)小程序網(wǎng)站建設(shè)網(wǎng)站改版，從內(nèi)容策劃、視覺(jué)設(shè)計(jì)、底層架構(gòu)、網(wǎng)頁(yè)布局、功能開(kāi)發(fā)迭代于一體的高端網(wǎng)站建設(shè)服務(wù)。
本文邏輯：

1. 發(fā)現(xiàn)問(wèn)題，截圖示意
2. 解決問(wèn)題的過(guò)程記錄
3. 總結(jié)用處，并軟推薦一發(fā)

前兩天在BearyChat收到這樣的一個(gè)報(bào)警消息:

409？Conflict？ 平時(shí)很少遇到這樣的錯(cuò)誤，貌似很?chē)?yán)重的樣子，嚇得我趕緊查看到底發(fā)生了什么。
仔細(xì)查看錯(cuò)誤詳情發(fā)現(xiàn)是因?yàn)槭褂猛粋€(gè)郵箱賬號(hào)多次注冊(cè)導(dǎo)致后面的請(qǐng)求數(shù)據(jù)庫(kù)直接報(bào)錯(cuò)。

但是，不應(yīng)該??！我們是事先有做檢查的。如果該郵箱已經(jīng)被注冊(cè)，會(huì)提醒并且不讓注冊(cè)的。難道對(duì)方是個(gè)***，直接調(diào)用API發(fā)請(qǐng)求？如果是這樣那就更加危險(xiǎn)了，我們已經(jīng)被盯上了！

可是這樣做對(duì)他也沒(méi)什么好處啊，并且IP顯示為國(guó)內(nèi)地址，如果真的是他好歹用國(guó)外的地址吧。想了想，還是仔細(xì)分析到底出了什么問(wèn)題吧。

再往下一看，發(fā)現(xiàn)自己完全是多想了。如果是***的話(huà)，下面的用戶(hù)行為就把他給完全暴露了！

這些用戶(hù)行為記錄默認(rèn)按照倒序排列，我們可以從下往上一條條看用戶(hù)的使用軌跡。通過(guò)用戶(hù)行為可以得知出錯(cuò)前的整個(gè)操作流程：

• 打開(kāi)我們網(wǎng)站的首頁(yè)
• 點(diǎn)擊“免費(fèi)試用“進(jìn)入注冊(cè)頁(yè)面
• 輸入郵箱
• 輸入密碼
• 再次出入密碼
• 點(diǎn)擊創(chuàng)建團(tuán)隊(duì)
• 點(diǎn)擊創(chuàng)建團(tuán)隊(duì)
• 團(tuán)隊(duì)創(chuàng)建成功
• 報(bào)錯(cuò)

那么問(wèn)題來(lái)了：有沒(méi)有什么異常的行為？
答：有！他點(diǎn)擊了創(chuàng)建團(tuán)隊(duì)兩次。

憑著我敏銳的嗅覺(jué)意識(shí)到可能是由于用戶(hù)快速點(diǎn)擊"創(chuàng)建團(tuán)隊(duì)"按鈕兩次導(dǎo)致。通過(guò)時(shí)間記錄發(fā)現(xiàn)第一次點(diǎn)擊是在1.86m，第二次在1.87m。也就是說(shuō)：用戶(hù)在很短的時(shí)間內(nèi)快速點(diǎn)擊了兩次。

剛剛的用戶(hù)行為記錄過(guò)濾了網(wǎng)絡(luò)請(qǐng)求，接下里我們結(jié)合網(wǎng)絡(luò)請(qǐng)求一起分析：

可以發(fā)現(xiàn)有兩個(gè)/members/email的GET請(qǐng)求，并且都成功返回404，這里代碼的意思是指該郵箱尚未被注冊(cè)，可以被使用。一個(gè)/members/create請(qǐng)求成功返回200，表示賬戶(hù)創(chuàng)建成功。最后報(bào)錯(cuò)的/members/create請(qǐng)求失敗返回409。

到這里基本確定出錯(cuò)原因就是由于用戶(hù)快速點(diǎn)擊創(chuàng)建團(tuán)隊(duì)導(dǎo)致。
有沒(méi)有這種可能呢，嘗試復(fù)現(xiàn)一下看看唄！于是，我打開(kāi)了注冊(cè)頁(yè)面，輸入郵箱和密碼，然后以超快的手速點(diǎn)擊創(chuàng)建團(tuán)隊(duì)N次。哈哈哈哈，不出所料，被我成功復(fù)現(xiàn)了！

只要能夠成功復(fù)現(xiàn)，這個(gè)BUG基本上就算被解決了，接下來(lái)就是去分析如何優(yōu)化代碼防止出現(xiàn)這種情況了。有兩個(gè)思路：1. 用戶(hù)點(diǎn)擊之后，設(shè)置被點(diǎn)擊的按鈕無(wú)效直到點(diǎn)擊請(qǐng)求完全被處理；2. 將驗(yàn)證郵箱是否存在的和創(chuàng)建團(tuán)隊(duì)兩個(gè)異步事件想辦法合并為一個(gè)原子操作。綜合考慮，決定使用第一種方案。因?yàn)閷?shí)現(xiàn)簡(jiǎn)單，對(duì)現(xiàn)有代碼改動(dòng)不大。

總的來(lái)說(shuō)：當(dāng)在沒(méi)有堆棧信息或者報(bào)錯(cuò)信息難以理解的時(shí)候，F(xiàn)undebug記錄的用戶(hù)行為真的很有用。五星推薦前端開(kāi)發(fā)接入到項(xiàng)目中！

關(guān)于Fundebug

Fundebug專(zhuān)注于JavaScript、微信小程序、微信小游戲、支付寶小程序、React Native、Node.js和Java實(shí)時(shí)BUG監(jiān)控。 自從2016年雙十一正式上線(xiàn)，F(xiàn)undebug累計(jì)處理了7億+錯(cuò)誤事件，得到了Google、360、金山軟件、百姓網(wǎng)等眾多知名用戶(hù)的認(rèn)可。歡迎免費(fèi)試用！

版權(quán)聲明

轉(zhuǎn)載時(shí)請(qǐng)注明作者Fundebug以及本文地址：

https://blog.fundebug.com/2017/09/06/fundebug-user-behavior-help-debug/

分享名稱(chēng)：我是這樣搞懂一個(gè)神奇的BUG-創(chuàng)新互聯(lián)
本文路徑：http://weahome.cn/article/dgisee.html