前端错误捕获

原文链接:https://blog.csdn.net/qq_26702033/article/details/79863485

前端错误的分类: 
及时运行错误:代码错误; 
资源加载错误;

及时运行错误的捕获方式: 
- try-catch 
- window.onerror,注册window.onerror事件。

window.onerror = function(){}
1
资源加载错误: 
-object.onerror,不能在冒泡阶段实现。 
- performance.getEntries();

performance.getEntries().forEach(item=>{console.log(item.name)})
1
Error事件捕获
window.addEventListener('error',function(e){console.log('捕获',e)},true)
1
跨域的js运行错误可以捕获吗?错误提示什么?应该怎样处理? 
可以捕获,但是也只会提示script error。 

这时候应该采取两个方法: 
1.客户端:在script标签增加crossorigin属性;

<script src="http://7.url.cn/index.js" crossorigin></script>
1
2.服务端:设置js资源响应头在脚本文件的 HTTP response header 中设置 CORS 
比如: Access-Control-Allow-Origin: http://yuncaijing.com

上报错误? 
1.采用ajax通信上报; 
2.利用image对象上报;

new Image().src = 'http://www.baidu.com/?r=1';
1
这时候发现请求发送出去了。

如果我们想要将js的错误信息记录到服务器数据库库中,我们一般想到的是通过ajax来实现。 
其实这样做有几个弊端:

不支持跨域操作,因为很多情况下是一台服务器要负责处理多台服务器的错误; 
大多数Ajax通信都是通过javascript库提供的包装函数来处理,如果库代码本身就有问题, 而你还在依赖该库记录信息,可想而知,错误消息是不肯能得到记录的。 
怎么办? 
可以使用Image对象巧妙的解决这个问题。

function logError(sev, msg){ 
var img = new Image(); 
img.src = “log.php?sev=” + encodeURIComponent(sev) + 
“&msg=” + encodeURIComponent(msg)”; 
}

作者:nummy 
链接:https://www.jianshu.com/p/3bc73971e3b3 
來源:简书 
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
 ———————————————— 
版权声明:本文为CSDN博主「qq_26702033」的原创文章,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/qq_26702033/article/details/79863485

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值