摘要: Fundebug的前端JavaScript錯誤監控插件更新至1.2.0：支持監控WebSocket連接錯誤；修復了監控unhandledrejection錯誤的BUG，即未用catch處理的Promise錯誤；以及一些其他優化。請各位用戶及時更新插件！
監控WebSocket連接錯誤
現在，WebSockect的應用場景越來越多。比如，Fundebug的首頁有展示累計處理錯誤的數量，目前是6億+。這個數據是后台實時計算，然后通過WebSocket返回給前端的。順便吐槽一下，某友商的統計方式比較詭異，斷網之后數字居然還在更新！我想原因大家都懂的:)
假設正確的WebSocket地址是wss://api.fundebug.com/api/events/count，若地址不小心弄錯了，
var ws = new WebSocket("wss://ap.fundebug.com/api/events/count");
ws.onerror = function(event)
{
console.log("WebSocket onerror")
}
則WebSocket連接顯然會出錯：
WebSocket connection to 'wss://ap.fundebug.com/api/events/count' failed: Error in connection establishment: net::ERR_SOCKS_CONNECTION_FAILED
Fundebug插件可以自動捕獲這樣的報錯，發送到我們的后台服務器，並且第一時間給開發者發送報警。另外，Fundebug的報錯並不影響WebSocket的錯誤處理回調函數onerror的執行。Fundebug控制台截圖如下:
修復監控unhandledrejection錯誤的BUG
unhandledrejection錯誤，即未使用catch處理的Promise錯誤。Fundebug很早就支持監控unhandledrejection錯誤，但是由於插件BUG，全部unhandledrejection錯誤都顯示為caught error。對此，我們非常抱歉，這次我們修復了這個BUG，感謝Fundebug用戶-zWing的反饋！
測試代碼：
Promise.reject("test unhandledrejection")
瀏覽器控制台會出現報錯：
Uncaught (in promise) test unhandledrejection
Fundebug插件可以自動捕獲這樣的報錯，發送到我們的后台服務器，並且第一時間給開發者發送報警。Fundebug控制台截圖如下:
新增silentDev配置屬性
如果您不需要收集開發環境中的錯誤，則可以將silentDev屬性設為true。這樣的話，Fundebug不會收集開發環境的錯誤，生產環境的錯誤仍然會正常收集。注意，我們是通過頁面的URL來區分生產環境和開發環境的，當URL中含有localhost或者IP時，判斷為開發環境，否則判斷為生產環境。
- 在HTML中配置
<script>標簽中配置silentDev屬性
<script src="https://js.fundebug.cn/fundebug.1.2.0.min.js"
apikey="API-KEY"
silentDev=true></script>
- 在JavaScript中配置silentDev變量
fundebug.silentDev = true;
當silentDev設為true時，Fundebug不再收集開發環境的錯誤。
修復silentVideo配置屬性BUG
Fundebug插件支持錄屏功能，可以幫助開發者更加形象地復現BUG，這個功能領先所有國內外同類產品！但是，由於該功能實現非常復雜，還有2個不大不小的BUG尚未修復：
- DOM操作過多的話錄屏功能會影響頁面性能，造成卡頓。
- 圖片驗證碼會重復加載，導致驗證一直失敗。
這2個BUG正在修復，因此，我們暫時注釋了錄屏功能。將silentVideo屬性設為false即可啟用錄屏功能。
但是，將fundebug.silentVideo設為false時，會發現沒有效果，這是我們插件的BUG，1.2.0版本已經修復。
如果希望體驗錄屏功能的話，將silentVideo屬性設為false即可。如果，你需要在生產環境中使用錄屏，請評估一下2個BUG是否會對您的應用造成影響。對此如果您還有疑問，歡迎聯系Fundebug客服！
另外，我們還對插件代碼進行了一些其他優化，此處不再贅述。
參考
- Fundebug文檔 - JavaScript插件版本
- Fundebug文檔 - JavaScript插件配置屬性silentDev
- Fundebug文檔 - JavaScript插件配置屬性silentVideo
- Fundebug博客 - 黑科技！Fundebug支持可視化重現出錯場景
關於Fundebug
Fundebug專注於JavaScript、微信小程序、微信小游戲、支付寶小程序、React Native、Node.js和Java實時BUG監控。 自從2016年雙十一正式上線，Fundebug累計處理了6億+錯誤事件，得到了Google、360、金山軟件等眾多知名用戶的認可。歡迎免費試用！
版權聲明:
轉載時請注明作者Fundebug以及本文地址：
https://blog.fundebug.com/2018/08/21/fundebug-javascript-1-2-0/