js 错误监控

╰半夏微凉° 2021-08-29 17:51 269阅读 0赞

1.错误的分类

*   即时运行错误：代码错误

(1) try...catch    (2) window.onerror /addEventLister

*  资源加载错误（不会冒泡但是可以捕获）

（1） object.onerror(写在标签上)  （2）performance.getEntries();可以拿到所有正常加载的资源 是一个数组。

（3）Error事件捕获

<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <meta http-equiv="X-UA-Compatible" content="ie=edge">
            <title>jsonp 演示</title>
            <script type="text/javascript">           
                window.addEventListener('error',function(e){console.log(e)},true)
    //true 捕获 false 冒泡
            </script>
        </head>
        <body>
            <script src="http://mkool.com/aa.html" charset="utf-8"></script>
        </body>
    </html>

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpbnhpbl96aHU_size_16_color_FFFFFF_t_70][]

js 跨域资源也可以捕获 需要在script 标签添加 crossorigin属性，设置js资源相应头 Access-Control-Allow-Origin:\*

**上报错误的基本原理**

（1）ajax

(2) 用 image对象上报

(new Image).src="http://mook.com/aa.html?a=error"

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpbnhpbl96aHU_size_16_color_FFFFFF_t_70]: /images/20210730/4d9416253d5c49b7848d42d8a56fd1cd.png

发表评论取消回复

表情：

评论列表（有 0 条评论，269人围观）

还没有评论，来说两句吧...

相关阅读

相关前端性能监控和错误监控

聚沙成塔·每天进步一点点 ⭐ 专栏简介前端入门之旅：探索Web开发的奇妙世界欢迎来到前端入门之旅！感兴趣的可以订阅本专栏哦！这个专栏是为那些对Web开发感

以你之姓@/ 2024年02月05日 16:33/ 0 赞/ 59 阅读

相关 javascript错误_JavaScript错误监控

javascript错误 One of the reasons I love front-end development is the reason many server-

￡神魔★判官ぃ/ 2023年02月22日 03:35/ 0 赞/ 36 阅读

相关聊聊前端监控—错误监控篇

编者按：本文转载自格子熊的掘金文章，快乐来一起学习吧！每当有人问起：你们的公司的这款应用用户体验怎么样呀？访问量怎么样？此时，你该怎么回答呢？你会回答：UV、PV 巴拉巴拉

悠悠/ 2022年12月08日 01:39/ 0 赞/ 315 阅读

相关小程序错误异常监控方案

本文主要介绍了微信小程前端错误异常监控系统，用于捕获收集线上小程序项目代码在使用生命周期中出现的异常情况。背景每一个前端项目上线后都会在出现线上问题，不论是PC项目还是

╰半橙微兮°/ 2022年11月26日 04:57/ 0 赞/ 443 阅读

相关 js 进度监控

今天做这个的时候遇到了点麻烦，发现在for循环中，处理数据完后，同步的执行dom更新操作，dom更新会滞后，会等待循环后再执行一次dom更新，这样就达不到进度监控的要求。于

忘是亡心i/ 2022年05月28日 13:29/ 0 赞/ 120 阅读

相关 JavaScript -- 前端错误监控

错误分类 1：运行错误（代码错误） 2：资源加载错误对应上面的俩种错误类型，分别有几种错误捕获方式。运行错误捕获方式 1：try...catch 组合 2：wi

悠悠/ 2022年04月23日 02:36/ 0 赞/ 191 阅读

相关前端错误监控的方法

前端错误的分类: 代码错误: try...catch... window.onerror 资源缺失错误(不会冒泡, 不会被window.onerro

深藏阁楼爱情的钟/ 2022年03月15日 01:50/ 0 赞/ 182 阅读

相关一步一步搭建前端监控系统：JS错误监控篇

摘要：徒手写JS错误监控。作者：一步一个脚印一个坑原文：[搭建前端监控系统（二）JS错误监控篇][JS] [Fundebug][]经授权转载，版权归原作者

绝地灬酷狼/ 2021年12月16日 22:29/ 0 赞/ 755 阅读

相关 js监控鼠标滚动事件

//滚动动画 windowAddMouseWheel(); function windowAddMous

短命女/ 2021年12月15日 11:39/ 0 赞/ 431 阅读

相关 js 错误监控

1.错误的分类即时运行错误：代码错误 (1) try...catch (2) window.onerror /addEventLis

╰半夏微凉°/ 2021年08月29日 17:51/ 0 赞/ 270 阅读