此文已由作者張磊授權網易雲社群發布。
後端服務一般都有監控措施，一般可以及時發現線上錯誤，但是很多專案的前端卻沒有線上報警服務，即使有錯誤，前端根本無法感知，但實際上使用者使用的系統、瀏覽器等環境十分複雜，還是有比較高的概率出現 bug 的。這時候線上錯誤的發現，一般有三個方向，要麼依賴於使用者報告，要麼依賴於測試發現，要麼是自己使用中發現問題。依靠使用者報告，這就嚴重影響了體驗，而且很多使用者不會報告或者其他原因復現率低，導致沒有報告。所以為了解決該問題，那前端需要乙個服務，遇到錯誤的時候，能主動上報問題，並作提醒，進行排查。同時也可以在測試環境也部署該服務，有時候測試沒有發現的問題，但這個主動上報就能幫我們提早發現** bug，再者我們可以和使用者同時接收到錯誤資訊，那麼我們就可以及早修復問題，把問題的影響盡可能的縮小，靜默解決。
專案是 nej 和 regular 開發的，以 spa 頁面為主。
這裡是使用 apm 作為線上報警的基礎服務。同時對線上線下環境分開處理。
上線該服務幾個月，線上線下的報錯發現的有幾十個。最近越來越穩定，出錯率越來越低了。當然也遇到了一些很難復現的 bug。
如果把錯誤僅僅當成錯誤來看，這肯定是不對的，應該從錯誤中發現些什麼，以後注意那些坑，畢竟已經有幾十個錯誤作為參照物了，也可以拿來分析了。錯誤可以歸為幾類：
uncaught typeerror: cannot read property 'ref0' of null這種一般是在 settimeout 裡對 this.$refs 進行操作，一般做法是在 settimeout 裡，進行二次檢測，但更好的做法是 cleartimeout。
uncaught typeerror: cannot read property '__cache' of undefined這種一般是在 settimeout 裡對介面請求進行操作，此時路由頁面已經觸發 destory 掉了，導致訪問 this 物件獲取不到對應的方法。一般做法是在 settimeout 裡，進行二次檢測，但更好的做法是 cleartimeout。
機率出錯線下測試**無問題發生，但是線上使用者報錯，這裡一般是沒有寫清楚邊界情況造成的。解決方案，通過錯誤查詢到對應**，分析邏輯。
uncaught typeerror: cannot read property 'indexof'/'replace' of undefined後端資料返回不規範造成的，可能約定是 string 但是實際中沒有返回值，又或者介面的錯誤處理有問題造成的。實際上兩者皆有。
引入公司其他服務腳本報錯
這些指令碼的錯誤，一般是通知相關人員進行 fix。
因為擴充套件導致的報錯
曾經乙個測試裝了乙個擴充套件，只要訪問某些頁面，短時間可以出現 1000+ 的錯誤
第三方瀏覽器，或者手機瀏覽器報錯
錯誤資訊這種一般是第三方加的指令碼，忽略即可。securityerror (dom exception 18): blocked a frame with origin "" from accessing a frame with origin "". protocols, domains, and ports must match.
堆疊資訊
qqiframeref@/#/m/a/:54:67qqgetvideos@/#/m/a/:68:53initvideoinstance@/#/m/a/:115:45hook@/#/m/a/:151:42global code@/#/m/a/:320:26
uncaught referenceerror: t is not defined這個錯誤，一開始覺得和1、2是類似的，邊界未處理，再加上是 lib 庫的**。後來實際上研究了邏輯，才發現使用的 lib 部分**丟失，在處理 ctrl + up 的時候的**函式沒了。。。後續解決方案，研究了下邏輯，不影響使用，刪掉該段**。
後來對靜態資源單獨乙個網域名稱，一開始沒有考慮到不同源的問題，apm 不報錯，以為是*****了很多。後來發現錯誤集中在 firefox、ie 上，錯誤資訊都是 script error。想到網域名稱的問題，才發現 apm 相當於停止工作一段時間了。這個問題的解決方案，需要對 nej 打包進行處理，允許 script 標籤新增屬性。同時允許非同步載入的 script 新增屬性即可。接著對靜態資源的伺服器新增跨域 header 配置。
access-control-allow-origin: *
免費體驗雲安全(易盾)內容安全、驗證碼等服務
更多網易技術、產品、運營經驗分享請點選。
ENVI Segmentation分類後錯分
envi segmentation錯分 envi對非監督分類k means方法得到的圖每層分割，segmentation出現錯分情況，同學的電腦也得到相同的結果，排除盜版軟體bug問題，由於已經得到分類圖，只想分割，但很多matlab的 是從分類開始，比如灰度直方圖 kmeans這種，所以利用mat...
裝置接入專案雜記
乙個幾年前的裝置接入平台專案，本人參與不多，因為要準備乙個類似專案，抽了兩個小時重新走讀了下核心 記錄一些知識點備忘 1 通訊基礎採用mina框架 mina服務端主要流程 a.ioaccept 監聽來自網路的請求 b.當新的連線建立時，建立session，該session對應某個ip加埠 c.資料報...
Angular專案接入Fundebug監控
angular專案接入fundebug fundebug簡介 因為我們使用angular angular 5 框架，本文介紹接入angular的大概使用方法。接入方法 報錯測試 當 都接入好以後，就可以測試啦。在專案的控制台輸入測試命令 fundebug.notify test hello,fund...