【推荐学习:javascript高级教程】
2、全局错误处理
由于前端开发人员水平不一、代码规范程度不一,不是所有JavaScript代码都有错误处理。因此,JavaScript代码在执行过程中常常会因为不可预见异常而导致代码意外终止,为此,我们需要全局捕捉错误异常,并及时提醒开发人员修改代码。只要绑定window.onerrot事件即可进行页面全局js error错误处理,代码如下:
1 2 3 4 5 |
|
绑定window.onerrot事件,js报错就会调用globalErrorHandle,其中:
msg:错误消息
url:报错页面url
l:代码报错行号
- c: 列号
error: 错误对象
把上文的案例1,用全局错误来捕捉,代码如下图:
控制台输出:
3、错误上报模块设计
全局错误处理并不能阻塞代码意外终止,也就是说当js执行过程中报错又没有try-catch错误处理,则会调用globalErrorHandle,但是后续代码会意外终止不再执行。因此,全局错误处理更多是全局错误记录并上报。通常做3个事情:
globalErrorHandle,全局错误捕捉;
- 将错误信息上报到服务器(报错页面、行号、列号等);
管理员在服务器上发现js错误信息时,责令相关人员修改;
看个案例,截图如下:
上图就是一个简单的js错误上报模块,错误查看页面,信息包括:错误源(哪个页面),错误描述,行号,操作系统+浏览器,操作人,操作时间等。
有几个注意事项:
1)上报内容过滤
如上图所示,好多错误信息都是一样的,如果在某个大循环里不断的在触发错误,则会不断向服务器发送错误信息,因此错误信息发送前先做过滤,操作如下:
- 页面加载时,先获取 错误源+错误描述 hashcode 去重列表;
- 全局错误捕捉时,生成的错误源+错误描述 hashcode是否已经存在,不存在则上报错误消息;
2)上报哪些内容
为了错误重现,建议尽可能使错误信息详细,至少应包含:
- 错误页面url
- 错误描述、错误行号、列号、stack信息
- 浏览器和操作系统信息
- 操作时间,甚至操作人、参数
更多编程相关知识,请访问:编程视频!!
以上就是javascript怎么进行全局错误处理的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
settimeout和setinterval之间有什么区别?
更多相关阅读请进入《javascript》频道 >>
Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者