前端错误监控的方法有哪些

前端错误监控是指通过各种手段收集、分析和处理前端应用运行中发生的错误

常用的前端错误监控的方法有

  1. 使用 try catch 方法
    1. 捕获特定代码块中的错误
    2. 多用于处理特定函数或代码段可能抛出的异常,尤其是异步代码
  2. 网络请求错误监控
    1. promise.catch
    2. try catch
  3. 全局错误处理 / 重写错误捕获函数
    1. 在 js 代码中重写 window.onerror、console.error, img.onerror 等错误捕获函数
    2. 将错误信息上报到监控服务器【通过接口的形式】
  4. 使用错误监控库,来监控各种 js 错误、资源加载错误、ajax 请求错误
    1. sentry
      1. Sentry:在 Sentry 平台上创建一个项目,然后在前端代码中安装 Sentry 的 js SDK,并且初始化 SDK, SDK 会自动捕获js错误并上报到 Sentry 平台
      2. sentry 平台会上报的错误进行分析
        1. 错误信息:错误类型、错误消息、错误堆栈信息
        2. 错误发生的环境:浏览器版本、操作系统版本、页面URL
        3. 错误影响的用户:受影响的用户数量、手影响的用户区域等
      3. sentry 平台还提供了报警功能,当错误发生时及时通知相关人员
    2. 友萌
  5. 可以使用 node 的子进程来监控错误信息
    1. node 的子进程模块提供了丰富的功能来创建和管理子进程,可以使用子进程来监控错误信息
    2. 创建子进程
      1. child_process.spawn()
      2. const childProcess = require('child_process');// 使用 spawn 创建子进程
        const child = childProcess.spawn('node', ['errorScript.js']);// 使用 fork 创建子进程
        const child = childProcess.fork('errorScript.js');
        
    3. 监听错误事件
      1. 子进程会发出 error 事件,当子进程发生错误时会触发改事件
      2. childProcess.on()
      3. child.on('error', (err) => {console.error('子进程发生错误:', err);// 上报错误信息到监控服务器reportErrorMessage(err);
        });
        
    4. 捕获标准错误输出
      1. 子进程的标准错误输出可以通过 hild.stderr 属性获取
      2. 可以使用childProcess.on() 方法监听 data 事件来捕获标准错误输出。
      3. child.stderr.on('data', (data) => {console.error('子进程标准错误输出:', data.toString());// 上报错误信息到监控服务器reportErrorMessage(data.toString());
        });
        
    5. 上报错误信息

      1. 使用 http 请求

      2. 使用消息队列

      3. 使用日志记录库

        1. Log4js

        2. Sentry

        3. Winston

  6. node 的主进程发生错误

    1. 使用 process.on('uncaughtException')事件,在主进程发生未捕获的异常时触发

    2. 使用第三方库 

      1. PM2: 用于管理 node.js 应用程序的进程管理器,提供了监控主进程错误的功能

      2. strong-agent: 监视和重启 node.js 应用程序的工具,提供了监控主进程错误的功能

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/822666.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Wix在国内受限?为何不使用中国版WIX自助建站,wix的国产替代工具

wix是一款知名的在线网站建站工具,能让用户在其网络上网站编辑器中拖放工具创建HTML5网站。用户可在他们的网站编辑器中加入额外的功能,例如社交网络按钮、电子商务功能、联系表格、电子报及社群论坛等。 但wix在国内不能用,或打开速度很慢&a…

事务相关:TransactionAspectSupport.currentTransactionStatus().setRollbackOnly();

1)当我们需要对一个事件增加事务时,可以使用Transactional(rollbackFor Exception.class),但此时由于抛出了异常,return方法无法继续执行。 2)此时,我们就需要手动触发事务,看代码如下&#x…

蓝桥杯C/C++A组省赛历年真题题解(2020~2024)

刷题整理2020~2024蓝桥A组真题。 20202021202220232024门牌制作卡片(模拟题)裁纸刀幸运数(数字)艺术与蓝球(模拟)既约分数直线(数学枚举)灭鼠先锋有奖问答(dfs)五子棋对弈(dfs)蛇形填数货物摆放(因子暴力枚举&#xf…

关于无界在vue中的应用

无界的链接地址:https://wujie-micro.github.io/doc/ 当我们配置好我们的页面是子应用的时候 1.处理好路由 1.对于我们定义的微前端服务,我们处理方式 if (v.frame true && !v.children.length && !v.unNeedMicroView) {v.component…

vue3页面跳转白屏

场景描述 在vue3项目中,使用layout封装布局,页面跳转时左侧菜单栏展示正常,右侧出现白屏,刷新页面后正常显示。 解决方案 方案一:查看是在template标签下面是否有直接的注释,如果有需要把注释写到div里面。…

安卓手机APP开发__媒体开发部分__音轨的选择

安卓手机APP开发__媒体开发部分__音轨的选择 目录 概述 查询可用的音轨 修改轨道选择参数 基于约束的轨道选择 选择特定的轨道 禁用轨道的类型和组 定制化轨道选择器

npm命令卡在reify:eslint: timing reifyNode:node_modules/webpack Completed in 475ms不动

1.现象 执行npm install命令时,没有报错,卡在reify:eslint: timing reifyNode:node_modules/webpack Completed in 475ms不动 2.解决办法 (1)更换淘宝镜像源 原淘宝 npm 域名http://npm.taobao.org 和 http://registry.npm.ta…

git clone自动安装最新版本,如何选择安装自己想要的其他版本,最简单解决方法

比如本人最新在安装 git clone https://github.com/synthetik-technologies/blastfoam.git 本人想要其中的3.0版本,但是上面git clone默认是使用最新版本6.2.0 这时候可以先执行 git clone https://github.com/synthetik-technologies/blastfoam.git 然后由…

【C++】力扣OJ题:构建杨辉三角

Hello everybody!今天给大家介绍一道我认为比较经典的编程练习题&#xff0c;之所以介绍它是因为这道题涉及到二维数组的构建&#xff0c;如果用C语言动态构建二维数组是比较麻烦的&#xff0c;而用C中STL的vector<vector<int>>,就可以立马构建出来&#xff0c;这也…

React-Redux(一)

​&#x1f308;个人主页&#xff1a;前端青山 &#x1f525;系列专栏&#xff1a;React篇 &#x1f516;人终将被年少不可得之物困其一生 依旧青山,本期给大家带来React篇专栏内容:React-Redux&#xff08;一&#xff09; 目录 1、简介 2、三大原则&#xff08;重点&#xf…

ECharts数据大屏展示效果

ECharts数据大屏展示效果 前言1、效果预览1.2、视频效果 2、使用框架3、如何处理屏幕自适应效果4、ECharts模块、dataV大屏插件 编写与布局5、往期回顾总结&#xff1a; 前言 数据大屏需整体效果好看&#xff0c;界面缩放自适应大小&#xff0c;全屏展示铺满整个屏幕并自适应&a…

米哈游(原神)一面算法原题

特斯拉裁员 10% 昨天&#xff0c;特斯拉发全员信&#xff0c;宣布全球裁员超 10%。 在内部信中&#xff0c;特斯拉 CEO 埃隆马斯克表示&#xff1a;"多年来&#xff0c;我们发展迅速&#xff0c;在全球范围内开设了多家工厂。随着增长&#xff0c;某些部门出现了角色和工作…

分布式基础环境搭建

使用 Linux 安装 Docker 环境,并启动数据库,缓存等容器服务 分布式基础环境搭建 一、安装 docker1.1、卸载系统之前的 docker1.2、安装 Docker-CE1.3、启动 docker1.4、设置 docker 开机自启1.5、测试 docker 常用命令1.6、配置 docker 镜像加速二、docker 安装 mysql2.1、下…

面经学习(众智宏图实习)

个人评价 难度还是有的&#xff0c;中等难度吧&#xff0c;可能是因为项目使用的是物流项目&#xff0c;该项目本来就比较庞大难度比较高&#xff0c;流的八股文我真的是一点不会&#xff0c;还需要加强&#xff0c;reidis的多路io复用模型没有深问&#xff0c;要是问了就寄了&…

HTML段落标签、换行标签、文本格式化标签与水平线标签

目录 HTML段落标签 HTML换行标签 HTML格式化标签 加粗标签 倾斜标签 删除线标签 下划线标签 HTML水平线标签 HTML段落标签 在网页中&#xff0c;要把文字有条理地显示出来&#xff0c;就需要将这些文字分段显示。在 HTML 标签中&#xff0c;<p>标签用于定义段落…

Golang面试题四(GMP)

目录 1.Goroutine 定义 2.GMP 指的是什么 3.GMP模型的简介 全局队列&#xff08;Global Queue&#xff09; P的本地队列 P列表 M列表 4.有关P和M的个数问题 P的数量问题 M的数量问题 P和M何时会被创建 5.调度器P的设计策略 复⽤线程 work stealing机制 hand off…

算法 第41天 动态规划3

343 整数拆分 给定一个正整数 n &#xff0c;将其拆分为 k 个 正整数 的和&#xff08; k > 2 &#xff09;&#xff0c;并使这些整数的乘积最大化。 返回 你可以获得的最大乘积 # 动态规划 def integerBreak(n:int)->int:dp[0]*(n1)dp[2]1 #从下标为2开始 &#xff0…

本地生活服务平台都有哪些,靠谱吗?

随着本地生活服务的发展潜力和盈利方式被不断挖掘&#xff0c;越来越多的人开始发现其中所蕴含着的巨大商机&#xff0c;大家所熟悉的抖音、小红书和支付宝等平台也纷纷上线了本地生活板块&#xff0c;再次印证了其前景的广阔。在此背景下&#xff0c;普通人想要趁势入局分一杯…

Linux ARM平台开发系列讲解(QEMU篇) 1.1 编译QEMU 构建RISC-V64架构 运行Linux kernel

1. 概述 QEMU可以模拟很多架构的CPU(ARM,RISC-V等),重点是免费,用来学Linux简直太适合不过了,所以,我打算开一章节来教QEMU的使用,这样也方便环境统一调试,本章节就讲解如何在Ubuntu搭建QEMU,我的环境是全新的Ubuntu22,QEMU下载的9.0,kernel下载的6.0. 2. 源码下载…

已适配开源鸿蒙OpenHarmony 4.1,Purple Pi OH开发板与时俱进

2024年4月3日&#xff0c;备受瞩目的OpenHarmony 4.1 release版本正式发布。值得一提的是&#xff0c;触觉智能的Purple Pi OH已经成功适配了这一新版本&#xff0c;展现出强大的兼容性和前沿的技术实力。此次升级不仅彰显了OpenHarmony在开放能力和应用生态方面的持续进步&…