前端错误分类

• 即时运行错误：代码错误
• 资源加载错误：资源加载失败

错误捕获方式

• 即时运行错误
  -- try...catch
  -- window.onerror
• 资源加载错误
  -- object.onerror
  -- performance.getEntries() -->返回请求的时间统计信息
  -- Error事件捕获阶段获取错误

// performance.getEntries()
(function () {
    if (!window.performance && !window.performance.getEntries) {
        return false;
    }

    var result = [];
    window.performance.getEntries().forEach((perf)=>{
        result.push({
            'url': perf.name,
            'entryType': perf.entryType,
            'type': perf.initiatorType,
            'duration(ms)': perf.duration
        });
    });

    console.table(result);
})();

//Error事件捕获
window.addEventListener('error',(e)=>{console.log(e)},true);

跨域的js运行错误也可以捕获，会提示'Script error'，获取不到错误的具体信息
解决方法：
1.在script标签增加crossorigin属性
2.设置js资源响应头 Access-Control-Allow-Origin:*

上报错误的基本原理

• 采用ajax通信的方式上报
• 利用Image对象上报
  (new Image()).src='http://baidu.com/1.html?e=1';

fundebug

• 推荐一个错误监控平台 fundebug，试了试觉得还不错
• fundebug是全栈应用错误实时监控平台。当用户应用出现错误时，Fundebug会通过邮件或者第三方工具立即给开发者发送报警，这样能够帮助开发者及时发现并且解决应用错误，从而提升用户体验。