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

目前創(chuàng)新互聯(lián)建站已為超過(guò)千家的企業(yè)提供了網(wǎng)站建設(shè)、域名、雅安服務(wù)器托管、綿陽(yáng)服務(wù)器托管、企業(yè)網(wǎng)站設(shè)計(jì)、新華網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長(zhǎng)，共同發(fā)展。

本文邏輯：

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

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

409？Conflict？ 平時(shí)很少遇到這樣的錯(cuò)誤，貌似很嚴(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ì)他也沒什么好處啊，并且IP顯示為國(guó)內(nèi)地址，如果真的是他好歹用國(guó)外的地址吧。想了想，還是仔細(xì)分析到底出了什么問(wèn)題吧。

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

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

• 打開我們網(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)了：有沒有什么異常的行為？
答：有！他點(diǎn)擊了創(chuàng)建團(tuán)隊(duì)兩次。

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

剛剛的用戶行為記錄過(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，表示賬戶創(chuàng)建成功。最后報(bào)錯(cuò)的/members/create請(qǐng)求失敗返回409。

到這里基本確定出錯(cuò)原因就是由于用戶快速點(diǎn)擊創(chuàng)建團(tuán)隊(duì)導(dǎo)致。
有沒有這種可能呢，嘗試復(fù)現(xiàn)一下看看唄！于是，我打開了注冊(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. 用戶點(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)在沒有堆棧信息或者報(bào)錯(cuò)信息難以理解的時(shí)候，F(xiàn)undebug記錄的用戶行為真的很有用。五星推薦前端開發(fā)接入到項(xiàng)目中！

關(guān)于Fundebug

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

版權(quán)聲明

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

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