博客首页

# 前端错误分类

代码错误
资源加载错误

# 错误捕捉方式

代码错误捕捉方式

try...catch
window.onerror

资源加载错误捕捉方式

object.onerror
Error 事件捕获
performance.getEntries()

window.onerror 只能捕获即时运行错误，不能捕获资源加载错误，因为资源加载错误不会冒泡。资源加载错误可以通过捕获 Error 来拿到，代码演示：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>错误监控</title>
	<link rel="stylesheet" href="">
	<script type="text/javascript">
		window.addEventListener("error", function(e){
			console.log('捕获了错误：', e)
		}, true)
	</script>
</head>
<body>
	<script src="//baidu.con/test.js" charset="utf-8"></script>
</body>
</html>

# 错误上报的方法

Ajax上传:Ajax上报就是在上文注释错误捕获的地方发起Ajax请求，来向服务器发送错误信息。
利用Image对象发送信息:(new Image()).src="http://post.error.com?data=xxx"

← 前端协作规范 webpack面试题 →