## 前言错误监控包含的内容是： - 前端错误的分类 - 每种错误的捕获方式 - 上报错误的基本原理面试时，可能有两种问法： - 如何监测 js 错误？（开门见山的方式） - 如何保证**产品质量**？（其实问的也是错误监控） ## 前端错误的分类包括两种： - 即时运行错误（代码错误） - 资源加载错误 ## 每种错误的捕获方式 ### 即时运行错误的捕获方式 **方式1**：try ... catch。这种方式要部署在代码中。 **方式2：**`window.onerror`函数。这个函数是全局的。 ``` window.onerror = function(message, source, lineno, colno, error) { ... } ``` 参数解释： - mesage为异常基本信息 - source为发生异常Javascript文件的url - lineno为发生错误的行号方式二中的`window.onerror`是属于DOM0的写法，我们也可以用DOM2的写法：`window.addEventListener("error", fn);`也可以。 **问题延伸：** `window.onerror`默认无法捕获**跨域**的js运行错误。捕获出来的信息如下：（基本属于无效信息）比如说，我们的代码想引入B网站的`b.js`文件，怎么捕获它的异常呢？ **解决办法**：在方法二的基础之上，做如下操作：（1）在静态资源服务器或者CDN的HTTP头中加如下 response header，表示允许跨域：（或者世界给静态资源`b.js`加这个 response header） ``` Access-Control-Allow-Origin: * ``` （2）引入第三方的文件`b.js`时，在` ``` 打开浏览器，效果如下： ![](http://img.smyhvae.com/20180311_2055.png) 上图中，红色那一栏表明，我的请求已经发出去了。点进去看看： ![](http://img.smyhvae.com/20180311_2057.png) 这种方式，不需要借助第三方的库，一行代码即可搞定。