前端可能出现的异常

JS代码语法异常

针对这种可能出现异常使用try catch捕获处理。
window.onerror可以处理没有经过try catch处理的错误
window.onerror = function(message, source, lineno, colno, error) { … }

AJAX请求异常

响应成功非正常code会根据状态码提示用户
catch会提示网络异常,并上报,
catch时如果是500相关的同时也会触发机器人报警通知开发处理。
通用请求库中拦截处理异常
可以使用自定义事件,监听XmlHttpRequest请求时触发自定义事件,从而达到监听效果

Promise 异常

window.addEventListener(‘unhandledrejection’, function (event) { … });

静态资源加载异常

window.addEventListener(‘error’, function(event) { … }, true)

JS框架异常处理

React中有异常处理生命周期方法componentDidCatch,还可以使用错误边界高阶组件封装来统一处理局部组件错误

浏览器网络异常

通过用于检测浏览器是否连网的navigator.onLine处理断网
通过用于检测网络状况的navigator.connection获取网络中网络状态,针对不同网速网络的做对应处理
通过断网事件”offline”和连网事件”online”针对具体操作提示用户

https://blog.csdn.net/weixin_40906515/article/details/114156972