- 综合排序
- 最热优先
- 最新优先
- 来自专栏Vue源码 & 前端进阶体系
【前端监控】页面错误监控
本文分为4个部分 1、页面错误分类 2、错误监听具体处理 页面错误分类 页面错误这种数据上报的重要性，想必不用我多说了吧 页面通常就分为3种错误 1、js 报错 2、资源加载错误 3、请求报错 其中js 一个多级不判空取值就很可能导致严重的白屏bug 你以为这种错误很少吗，就我们团队就这种bug就出现好多次，被大佬骂惨了，看看我们现在线上监控到的错误 一大半都是 of undefined,of null 否则会对开发者不友好 3、无法捕获语法错误 并不是什么错误都能捕获到，语法错误就不可以比如你乱用关键字 const function = 1 语法错误，可能代码文件解析中断，监听代码当然没有生效 4、 ，具体可以看 【前端监控】静态资源测速&错误上报 这里再简单描述下 前面我们用window.onerror 来监听js执行错误，但是它并不能获取到资源加载失败的错误，因为这些错误不会向上冒泡，但是我们可以进行捕获 所以我们这里只监听资源错误就好了 window.document.addEventListener('error',handler, true） 请求报错 请求报错的内容，也已经写过，具体可以参考 【前端监控
2.8K10发布于 2021-09-09 - 来自专栏Vue源码 & 前端进阶体系
【前端监控】监控数据都有什么
前端监控系列，SDK，服务、存储 ，会全部总结一遍，写文不易，点个赞吧 监控的内容我们已经说了很多了，那么我们一般上报一条监控内容都具体包含什么数据呢 今天就来详细列举一下 本文列出的数据会这样说明 1、有什么数据 2、作用是什么 3、怎么获取 我会给每个具体分个类，按分类来逐个说明 数据大概分为下面几类 1、监控点数据 2、用户信息 3、设备信息 4、项目信息 5、日志信息 下面就按这个分类来说明里面包含的详细数据 监控点数据 这个就是每个监控点类型相应的数据，像接口请求信息，静态资源，首屏测速等等 具体可以在相应的文章中查看 1、自动抓取接口请求数据 2、静态资源测速&错误上报 3、页面错误监控 4、单页首屏测速 生成方式和 aid 一样 设备信息 关于设备信息的数据就比较多了，对于前端比较重要，前端看重兼容性，各端的支持五花八门，定位问题需要考虑这一点 设备信息，一般我们可以通过 navigator.userAgent (); if (net.indexOf('4g') >= 0) return NetworkTypeNum.net4g; if (net.indexOf('wifi') >= 0) return
1.8K50发布于 2021-09-10 - 来自专栏Article
前端性能监控
当我们谈及前端性能的时候，我们究竟想聊什么？ 最近在做前端性能监控的一些事，这篇文章算是前端性能方面的基础知识梳理。 如何监控？ Synthetic Monitoring：合成监控 合成监控是指在模拟环境中的监控，通常我们自己使用 Lighthouse 去跑一个页面，生成的性能报告就可以认为是合成监控。 优点： 实现简单 采集到的数据维度更高，包括硬件的 对用户无影响 能够生成丰富的图标信息，瀑布图 缺点： 无法还原现实场景 样本数据无法代表现实情况 Real User Monitoring：真实用户监控
2K20编辑于 2022-06-15 - 来自专栏Vue源码 & 前端进阶体系
【前端监控-序】简说腾讯团队的前端监控
小东西快快学快快记，大知识按计划学，不拖延 我现在是有参与到团队的日志系统的开发维护，所以今后打算把 前端监控 做成一个系列，把整个前端监控链路给总结一遍 帮助自己巩固知识，也帮助想了解这方面内容的同学 这篇文章将是一个序篇，总览地说一下 前端监控，大概分为5个部分 1、监控典型例子 2、为什么需要监控 3、监控上报什么内容 4、监控上报的完整链路 5、完整的上报系统包含什么 没有监控典型例子 说真的 如果你没有监控错误上报，谢谢，你可以溜溜球了 为什么需要监控 看了上面的例子，大家应该也体会到 前端监控的重要性了吧，再详细说，就是3个点 1、被动为主动，及时发现问题，以免造成损失 问题是不可避免的， 监控上报什么内容 那么我们前端监控，需要上报什么东西，才能对应用有一个完整的监控呢？ 4、可视化配置系统 5、用户行为追踪系统 所以看起来内容还是挺多的，但是我们当然是以业界现有的工具为主，其次才是自己开发。
1.4K30发布于 2021-08-13 - 来自专栏技术杂记
Elasticsearch 监控4
创建nginx用户 [root@es_node cert]# useradd nginx [root@es_node cert]# grep nginx /etc/passwd nginx:x:505:505::/home/nginx:/bin/bash [root@es_node cert]# chown -R nginx.nginx /usr/local/nginx/ [root@es_node cert]# ll total 12 -rw------- 1 nginx nginx 1249 Jan
29110编辑于 2022-02-10 - 来自专栏技术杂记
RabbitMQ 监控4
创建用户 [root@rabbitmq ~]# rabbitmqctl list_users Listing users ... cooper [] guest [administrator] [root@rabbitmq ~]# rabbitmqctl add_user mqmonitor mqpass Creating user "mqmonitor" ... [root@rabbitmq ~]# rabbitmqctl list_users Listing users ... cooper []
25330编辑于 2022-02-09 - 来自专栏技术杂记
Mysql 监控4
目前是使用 root 的身份执行的，但是 zabbix agent 是使用 zabbix 身份来执行这条命令的，我们尝试使用 zabbix 来执行一下，看看效果
1.2K30编辑于 2022-06-30 - 来自专栏Vue源码 & 前端进阶体系
【前端监控】日志池
前端监控系列，SDK，服务、存储 ，会全部总结一遍，写文不易，点个赞吧 前端监控上报数据的时候，是怎么发请求的呢，是每产生一条监控数据就上报一次吗 当然不是了，如果监控点很多，那估计请求都快发爆炸了， 请求发得多，不仅会加重服务器压力，数据丢失的概率也大，毕竟10条请求的成功率肯定比 一条请求 的成功率小嘛 所以才会出现日志池，这篇内容不属于前端监控的一部分，属于是其中的一个优化点 不多说了，开始正文
1K20发布于 2021-09-09 - 来自专栏前端那些趣事
前端监控那些事
监控这个词对于前端，个人觉得有三个定义，分别是“性能监控”、“异常监控”、“数据监控” 性能监控则是针对web应用的性能，涉及包括用户体验、用户交互时间等 异常监控则是指Web应用得不到预期效果结果的情况监控 数据监控则是获取用户使用过程的行为数据反馈 1.性能监控 性能监控可以让我们更好的监控当前应用的性能情况，然后对性能情况反馈去做优化，性能会影响到用户体验，而常见的性能指标我们能通过浏览器Performance 2.1 Sentry Sentry是开源的前端异常监控上报工具，通过集成到项目中，你可以在不同环境（测试，生产等）中，帮你收集记录问题，并定位到问题所在代码 Sentry官方服务需要付费，建议自行搭建 （code） 前端项目中，异常监控分为异常捕获和异常上报 window.onerror（JS异常） 我们使用 window.onerror 捕获一般情况下 JS 错误的异常信息。 主要用于捕获偶现的难以捕获的异常情况，最适合处理那些我们无法控制的错误，不过大部门前端代码少依赖环境，比较少用到，用node开发后端的同学，经常会有非常多的异步调用，需要对异常作捕获处理 try {
1.6K30发布于 2020-07-03 - 来自专栏腾讯云可观测专栏
前端性能监控（RUM）
简介 腾讯云前端性能监控 (RUM) 是一站式前端监控解决方案，用户只需要安装 sdk 到自己的项目中，通过简单配置化，即可实现对用户页面质量的全方位守护，真正做到了低成本使用和无侵入监控。 前端性能监控专注于 Web，小程序等大前端领域，主要关注用户页面性能（页面测速，接口测速，CDN 测速等）、质量（JS 错误，Ajax 错误等），并且通过联动腾讯云应用性能监控实现对前后端监控一体化的打通 为什么要有前端监控 作为一名前端开发者，想必你一定遇到过这些问题。 业务报错无处查，用户环境复杂多变，线上问题复现困难。 相较于后端监控，前端监控更贴近于用户，能高效反馈真实用户使用我们产品过程中的体验，于开发者而言，前端监控是聚焦在技术领域的监控产品，对于产品性能质量提升、发现现网问题都是非常重要的工具。 03 低成本 使用腾讯云前端监控，几乎没有学习成本，只要您有过基础的前端知识，就可以放心的使用。
3.4K30发布于 2021-07-16 - 来自专栏前端技术研究和应用
浅析前端监控技术
日志监控普通上报日志上报的常见方式，各有优缺：fetch/xhr：最常见的上报方式，可能遇到跨域问题。页面卸载时，采用异步上报可能导致数据丢失，同步上报将阻塞浏览器的关闭，导致页面卡顿。 WebWorker介绍参考：https://juejin.cn/post/7139718200177983524（3）img上报因为img资源浏览器不会阻止，跨域会针对xhr这种请求才会生效，一般前端监控上报通过一个 + $.param(data)}badjsbadjs-web是腾讯开源的一款前端监控系统。 badjs-webbadjs-report GItHub：https://github.com/BetterJS/badjs-reportsentrysentry是一款开源的支持多语言（JS、Go、Python等）的错误日志监控系统 本地部署：https://blog.csdn.net/zzddada/article/details/119716725落地方案：https://www.jianshu.com/p/559f70bbfcdc监控页面示例
1.3K40编辑于 2023-04-14 - 来自专栏余生大大
Skywalking接入前端监控
前言 Skywalking从8.2版本开始了支持浏览器端的监控，也就是在仪表盘中的Web Browser选项，但是应用的人好像并不多，我在搜索相关文章时对配置Skywalking前端监控的文章很少，所以只能在组合有限的资料中进行配置 我的前一篇文章搭建的Skywalking为8.6版本的，如果有低版本的同学或者需要搭建的同学可以看一下，地址如下： Docker安装SkyWalking并监控Java程序 配置依赖 Skywaking 的浏览器接入需要引入一个客户端的js包，然后再需要采集信息的地方使用包内的函数，并不能像java一样无侵入性的进行监控 安装依赖 执行以下命令安装客户端依赖 npm install skywalking-client-js --save 安装完成后会在node_modules里出现skywalking-client-js的包，如下图 Router配置 router配置是配置监控触发位置，在router的配置内容中先引入
2.6K50编辑于 2022-11-02 - 来自专栏编程
前端异常监控系统
其实这个问题很常见，但是这次我觉得这个问题如果不是我们自己同事发现的，那就很恐怖，可能废很大精力才能查出问题，甚至会导致很严重的线上bug，细思极恐，刚好前不久成都FCC的大前端交流会上叶小钗谈到了监控这块 也可以通过其他方式拿到这些老版本浏览器的columnNo和error参数，目前监控主要是针对移动端，也没太大必要去兼容老版本的浏览器。 （图1） （图2） （图3） （图4） grunt生成sourcemap： sourcemap解析问题 思考的时候发现最大的难点应该在sourcemap解析。 引入监控的项目，由于业务原因可能需要上传一些业务信息方便分析，所以预留一个配置字段，上传错误的时候请求会带上业务相关信息。 现在第一版已经上线，并且在刚上线不到两个小时，就收到了报错邮件，吓得我急忙查找bug，很快查出来了问题来，这个bug应该存在很久了，但是因为没有阻塞性，并且没有影响到业务，也一直没被发现，结论是我们这个前端异常监控功能还是很成功
1.8K70发布于 2018-01-12 - 来自专栏Vue源码 & 前端进阶体系
【前端监控】离线日志
前端监控系列，SDK，服务、存储 ，会全部总结一遍，写文不易，点个赞吧 离线日志，一般指的是用户离线时产生的日志。 离线日志的作用主要有两点 第一，保证日志完整性。 本文分4部分 1、基本思路 2、api简介 3、具体处理 4、代码仓库 基本思路 最简化的说法就是，监控的数据存在本地 当然不是一股脑存了，也是有条件的。 1、上报失败的时候，把监控的数据存在本地，用于后续重试上报 2、用户离线 or 服务不稳定。减少频繁上报 3、上报等级不高的数据，会存在本地，提供方法供用户手动上传，定位更加细致的问题。 网页只能访问自身域名下的indexdb，无法跨域访问 4、存储空间大。 为了区分离线日志类型，还有一个字段 offline_type 值为 fail_log，表示上报失败的日志 值为 common_log，表示等级不高存本地的日志 这个字段只是为了方便本地区分 离线日志，对于监控数据没有意义
2.1K50发布于 2021-09-09 - 来自专栏较真的前端
前端异常监控实践
此外，一个可靠的前端监控系统还可以化被动为主动，不再被动的等待客服来找，而是在问题出现时开发人员可以第一时间知道并解决。 图片来自《把前端监控做到极致》 利用Promise.prototype.catch()可以捕获Promise实例中发生的异常。 第5点完备性比较依赖于前端监控平台的“消费端”，即不同的应用场景对于完备性有不同程度上的要求。但是前4点应该所有前端监控平台有着大致相同的需求。 图片来自《把前端监控做到极致 总结 如果你已经部署了一套稳定的前端监控系统之后，你会发现bug的数量是无法想象的。大数据处理是个难点。 今后如果有时间，我会整理一下关于如何处理庞大的错误日志。 参考文章： 把前端监控做到极致 [浏览器端 JavaScript 异常监控 For Dummies.pdf](https://github.com/kof97/QCon/blob/master/全球软件开发大会
1.5K20发布于 2019-07-31 - 来自专栏细嗅蔷薇
使用前端性能监控平台FrontJS监控教程
FrontJS介绍 FrontJS 是一款用于监控前端性能的监控工具，其范围包括WEB和APP等。 FrontJS 为开发人员提供了包含错误收集、页面流向、性能分析、资源及请求监控等用户体验改进所需的信息，最主要的功能当然还是 JS 错误监控：我们会收集精细到 console.log 级别的任何 Javascript ，方便查找错误位置，在每个浏览器中都可以使用完整的堆栈追踪 自定义信任域，可以对跨域信息做出灵活调整有助于监控页面是否发生 XSS 或被植入病毒 页面性能监控，包含 DNS 时间， DOM 渲染时间等信息 参考 前端异常监控平台对比 国内有哪些较好的前端性能监控平台？ - 知乎 版权所有：可定博客 © WNAG.COM.CN 本文标题：《使用前端性能监控平台FrontJS监控教程》 本文链接：https://wnag.com.cn/1263.html 特别声明：除特别标注
1.9K20发布于 2020-04-20 - 来自专栏小泽的专栏
Web页面性能优化——前端监控监控
而前端性能监控则可以帮助我们实时监测和分析页面加载速度、交互性和视觉稳定性等指标，通过定位和解决性能问题，进一步提升页面的加载速度和用户体验。 而前端性能监控可以收集页面加载次数、完全加载耗时、慢加载占比、JS 错误次数等关键指标数据。这些数据可以帮助我们了解页面加载性能的具体情况，识别潜在的性能问题，并对页面进行有针对性的性能优化。 本文分为接入前端性能监控、使用前端性能监控、性能优化三部分，可以通过目录跳转到对应的部分浏览。 接入前端性能监控1.登录腾讯云可观测平台-前端性能监控控制台，首次使用需要创建业务系统图片2.业务系统用于分组管理您接入的应用，请根据业务需要进行相关信息的配置图片业务系统名称：根据需要填写，用以区分分组业务系统描述 ，可以在数据概览页面看到对应的数据，也可以查看网络请求验证数据是否正常上报数据总览：图片浏览器打开开发者工具查看请求，如正常上报，您应该能看到下述请求：图片至此，我们已经完成了RUM接入的全部流程使用前端性能监控完成接入后
1.7K110编辑于 2023-09-12 - 来自专栏编程技术分享
前端性能和错误监控
前言 这几天心血来潮，想了解一下前端监控的相关知识，可是在查看了很多资料之后，发现没有详细介绍前端监控的相关文章，都是讲个大概，反倒是现成的前端监控工具有不少。 为了深入学习前端监控的相关技术原理，这几天都在查阅相关的资料。现在打算写一篇文章详细介绍一下前端监控，对这几天的研究做一个总结（于是就有了本文）。 // 前端监控流程 数据采集 --> 数据上报 --> 服务端处理 --> 数据库存储 --> 数据监控可视化平台 不过，本文只讲监控中的数据采集和数据上报两个步骤，后续流程需读者自行研究探索（这也是一种乐趣 $store.state.pageLoadedStartTime) }) } 除了性能和错误监控，其实我们还可以做得更多。 s=460&v=4" alt="">
<script src="192.168.10.15/test.js"></script> <script
1.9K20发布于 2020-09-28 - 来自专栏较真的前端
把前端监控做到极致
作者介绍： 扬森：阿里巴巴集团数据技术及产品部前端稳定性负责人，阿里前端监控平台Clue创始人。 本文将从 采集、数据处理、分析、报警 4 个维度进一步阐述如何把前端监控做到极致。 小福利 如果你还没有使用前端监控服务，那么可以先看看这个小福利。 只用两行代码就能打造一个前端异常实时监控平台，还带报错数统计功能。 异常波动一定有元凶 前端发生故障最常见的原因就是新发布的版本存在 Bug，那么这种问题在监控平台中如何提供分析思路呢？ 当然，也并不是所有的波动都是前端变更引起。 结语 前端监控看似简单，但想要监控真正发挥价值，还需要从各个方面进行不断的优化和打磨。当然，最重要的是，要意识到前端监控的必要性，及早开始进行监控，才能更好的避免线上故障的产生。
1.4K50发布于 2018-06-08 - 来自专栏采云轩
浅谈前端埋点&监控
浅谈前端埋点&监控 https://www.zoo.team/article/monitor 一、为什么需要埋点&监控 在开始正文之前，我们先想想为什么需要埋点&监控？ 系统会不会经常出现异常 4. 如何更好地满足用户需求服务用户 当站在技术视角时，经常会问如下几个问题： 1. 系统出现异常的频率如何 2. 异常出现后如何快速进行定位追踪 3. 同时对于前端监控来说，大致可以分成三个方向：数据监控、性能监控、异常监控。 性能监控 性能监控主要是针对前端进行监控，比如不同用户在不同地区使用不同机型下的首屏加载时间、页面的白屏时间、静态资源下载时间等数据。 通过针对这些性能数据进行监控，可以大概反映前端性能的好坏，根据性能监测的结果可以进一步的去优化前端性能。
3.9K40编辑于 2022-12-01
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号