課程思維導圖
Q:前端錯誤分類有哪些?
- 即時執行錯誤,如程式碼錯誤
- 資源載入錯誤
Q:前端錯誤捕獲方式分別是什麼?
- 即時錯誤的捕獲方式
- try-catch
- window.onerror(只能捕獲即時錯誤)
- 資源載入錯誤的捕獲方式
- Object.onerror
- performance.getEntries() 拿到所有成功載入資源的集合
- Error事件捕獲
Q:如何使用Object.onerror捕獲資源載入錯誤?
(注意:這種錯誤不會冒泡,但可以捕獲)
window.addEventListener('error', function (e) {
console.log(e)
}, true);
複製程式碼
Q:跨域的JS執行錯誤可以捕獲麼?錯誤提示是什麼,應該怎麼處理?
可以捕獲,提示“Script error”,具體錯誤資訊無法獲得 解決方案:
- 客戶端:在script標籤增加crossorigin屬性
- 服務端:設定JS資源響應頭Access-Control-Allow-Origin
Q:客戶端上報錯誤的基本原理是什麼?
- 使用Ajax通訊的方式上報
- 利用Image物件上報:(new Image()).src = "http ://xxx/com/test";