在线客服
扫描二维码
下载博学谷APP扫描二维码
关注博学谷微信公众号
前端异常监控是怎么回事?前端异常是指,在用户使用Web应用时,无法快速得到符合预期结果的情况,不同的异常带来的后果程度不同。要前端异常监控弄清楚这个问题,大家需要明白前端异常监控的四大阶段、情况分类和产生原因。本文为大家整理了所有的前端异常监控的所有资料,大家要想完全搞清楚开始的问题,看这篇就够了。
1、前端异常监控的阶段:
一般而言,一个监控系统,大致可以分为四个阶段:日志采集、日志存储、统计与分析、报告和警告。
收集阶段:收集异常日志,先在本地做一定的处理,采取一定的方案上报到服务器。
存储阶段:后端接收前端上报的异常日志,经过一定处理,按照一定的存储方案存储。
分析阶段:分为机器自动分析和人工分析。机器自动分析,通过预设的条件和算法,对存储的日志信息进行统计和筛选,发现问题,触发报警。人工分析,通过提供一个可视化的数据面板,让系统用户可以看到具体的日志数据,根据信息,发现异常问题根源。
报警阶段:分为告警和预警。告警按照一定的级别自动报警,通过设定的渠道,按照一定的触发规则进行。预警则在异常发生前,提前预判,给出警告。
2、前端异常分类:
根据异常代码的后果的程度,对前端异常的表现分为如下几类:出错、呆滞、损坏、假死和崩溃。
a. 出错
界面呈现的内容与用户预期的内容不符,例如点击进入非目标界面,数据不准确,出现的错误提示不可理解,界面错位,提交后跳转到错误界面等情况。这类异常出现时,虽然产品本身功能还能正常使用,但用户无法达成自己目标。
b. 呆滞
界面出现操作后没有反应的现象,例如点击按钮无法提交,提示成功后无法继续操作。这类异常出现时,产品已经存在界面级局部不可用现象。
c. 损坏
界面出现无法实现操作目的的现象,例如点击无法进入目标界面,点击无法查看详情内容等。这类异常出现时,应用部分功能无法被正常使用。
d. 假死
界面出现卡顿,无法对任何功能进行使用的现象。例如用户无法登陆导致无法使用应用内功能,由于某个遮罩层阻挡且不可关闭导致无法进行任何后续操作。这类异常出现时,用户很可能杀死应用。
e. 崩溃
应用出现经常性自动退出或无法操作的现象。例如间歇性crash,网页无法正常加载或加载后无法进行任何操作。这类异常持续出现,将直接导致用户流失,影响产品生命力。
异常错误原因分类
3、前端产生异常的原因:逻辑错误、数据类型错误、语法句法错误 、网络错误、系统错误。
a、逻辑错误案例:业务逻辑判断条件错误;事件绑定顺序错误;调用栈时序错误;错误的操作js对象。
b、数据类型错误案例:将null视作对象读取property;将undefined视作数组进行遍历;将字符串形式的数字直接用于加运算;函数参数未传。
c、网络错误案例:慢;服务端未返回数据但仍200,前端按正常进行数据遍历;提交数据时网络中断;服务端500错误时前端未做任何错误处理。
d、系统错误案例:内存不够用;磁盘塞满;壳不支持API;不兼容。
以上就是前端异常监控的全部分析,大家都理解了吗?想要学习前端的更多内容,现在就上博学谷官网学习吧!
— 申请免费试学名额 —
在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!
相关推荐 更多
新手小白学习web前端必看基础攻略
本篇文章将给新人小白带来学习web前端必看攻略。近些年来IT岗位大火,这些攻略是新手小白学习想要学习web前端很值得借鉴的,相信很多人也知道学好一门IT技术并非简单事,博学谷在十余年的授业生涯里总结了一套适合新手小白学习web前端必看的基础攻略,今天就分享给大家。
6238
2019-07-11 13:20:43
Node.js-Koa2框架实战项目需要学习哪些知识点?
Node.js-Koa2框架实战项目需要学习哪些知识点?Node.js-Koa2框架实战项涉及技术选型和知识点、技术方案设计、用户管理、用户设置、创建微博、个人主页、广场页、首页功能、at 和回复、at 提到我的、线上环境等内容。
6935
2019-10-15 14:27:44
HTML5开发APP有哪些优点和缺点?HTML5优势和劣势大对比
HTML5开发APP有哪些优点和缺点?对比起来看,HTML5开发APP的优势明显大于劣势。比如HTML5有跨平台,开发成本低,推广更容易等等优点,同时它也有着一些缺点,比如容易受到网络的限制,用户体验性一般,变现慢等问题。本文将为大家详细分析一下,HTML5开发移动APP的优势与劣势。
5732
2019-10-23 12:45:55
前端开发需要学习些什么?
许多前端初学者在一开始学习的时候,遇到的首要问题就是不知道如何规划学习内容。因为很多人连自己要学习的内容都不太清楚,那么,前端开发到底需要学习些什么呢?简单来讲,前端开发需要学习HTML5+CSS3、移动Web网页开发、JavaScript网页编程、Node.js与AJAX、Vue.js以及React.js等内容,下面我们来看看具体的学习内容吧~
4694
2020-05-27 15:50:31
微前端需要 JavaScript为什么?原因分析
许多微前端解决方案都是JavaScript 框架。JavaScript 不是可选的。每个人都想要高度交互的体验,而JS 在提供这些体验中发挥着至关重要的作用。许多JavaScript 框架都提供了 isomorphic 渲染能力。不仅能够在客户端进行拼接(stitch),还能在服务器上准备好一切
2993
2020-10-15 10:37:28