微信小程序運行過程中,基於需求大整改或者代碼邏輯,接口聯調存在爭議等等原因,會出現寫莫名其妙的報錯,我們都要復現錯誤現象才能排查錯誤解決問題的話,那么效率有點低,而且特別被動。
如果是接口數據問題,可以通過用戶操作日志,具體參考https://www.cnblogs.com/ljt-8961/p/15918646.html或者https://www.cnblogs.com/ljt-8961/p/15918758.html,可以把接口請求和返回數據全過程做上報操作。可以一步步排查具體到那個功能問題。然而說到底,這些都是被動后的處理方案,被觸發錯誤后上報到我們這邊,我們做的處理,沒有在源頭上處理問題。
如果是初版功能的開發,我建議打開微信的錯誤告警設置,設置下只要出現錯誤就馬上上報,把自己添加到微信提醒的群聊里面,如圖
那么我們能夠及時發現自己的錯誤,建議針對后台返回的接口統一做try catch處理,注意try catch里面嵌套的邏輯不宜過多,可以查看這方面的性能問題。但是上述的是初版的,如果后續多次出現微信的推送,特別是休息時間是很煩的,基本初版后出現大問題的情況相對少了很多,這個情況下,我們可以提高微信推送的門檻,例如10分鍾內5次出現此報錯,就推送,其他的使用我們自己的錯誤上報。
了解vue的知道vue常見有三種上報錯誤方法,但是小程序不支持window對象,也就是說window.addEventListener('error')無效。再回到小程序,微信小程序有執行錯誤的周期onError,我們可以在這里獲取到錯誤,然后使用微信的api上報錯誤或者后台給我們接口上報到企業微信或者我們的后台操作系統等等。如果你使用的不是原生小程序開發,例如uniapp,同時可以在main.js執行以下代碼,當然上報的方案同上所述或者自己有其他的方案的
let errorLimit = false //系統錯誤捕獲 const errorHandler = (err, vm, info) => { if(base.env !== "prod") { return } // 代碼執行報錯 if(errorLimit) { return } let _errObjReport = { occurrenceTime: publicFn.formatTime(Date.now()), occurrenceUser: store.getters.userId || "noUserId", operatingEnv: "miniApp", info: err.message, type: "main" }; errorLimit = true try{ _errObjReport.info = err.toString().split("\\n")[0]; } catch(err) { console.log("catcherr", err) } apiJsErrSendMsg({ chatid: "jsError", content: _errObjReport }).then(res => { global._logger.writeLogs("上報錯誤成功"); setTimeout(() => { errorLimit = false }, 500) }).catch( err => { global._logger.writeLogs("上報錯誤失敗", err); setTimeout(() => { errorLimit = false }, 500) }) } Vue.config.errorHandler = errorHandler; Vue.prototype.$throw = (error) => errorHandler(error, this);
我們開發的基礎任務是保障項目能正常運轉,但是基於技術追求和個人職業素質修養,我們會一步步優化自己的代碼,了解自己的代碼會出現什么問題,加以完善。基礎上我們處理好錯誤上報和用戶操作上報就可以跟蹤用戶操作步驟,弄清楚用戶的信息狀態是否正常。不斷踩坑,發現問題,你就會進步。