面试：错误监控

问题

1.前端错误分类

2.错误的捕获方式

3.上报错误的基本原理

4.如何保证产品质量

5.产品质量体系

前端错误分类

即时运行错误：代码错误
1. try catck
2. window.onerror
资源加载错误
1. object.onerror
2. performance.getEntries() 获得已加载资源的加载时长。获取所有资源请求的时间数据
3. Error 事件捕获

跨域js错误捕获

上报错误的基本原理

采用Ajax通信的方式上报
利用Image对象上报（多数采用这种方式）

(new Image()).src = "http://baidu.com/上报路径?参数"

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>performance.getEntries</title>
    <meta http-equiv="x-dnx-prtfetch-control" content="on">
</head>

<body>
</body>
<div class="div" id="div"></div>
<script>
    (function () {
        var result = [];
        performance.getEntries().forEach(function (item) {
            result.push({
                'url': item.name,// 资源名称，也是资源的绝对路径
                'entryType': item.entryType,//资源类型
                'type': item.initiatorType,//谁发起的请求，link就是link标签
                'duration(ms)': item.duration//加载时间
            });
        });

        console.table(result);
    })()
</script>
</html>

问题

前端错误分类

跨域js错误捕获

上报错误的基本原理

猜你喜欢