认识
2024年04月25日
一、认识
常见的用户行为,可以归纳为页面跳转、鼠标 click
行为、键盘 keypress
行为、 fetch / xhr
接口请求、console
打印信息。
Sentry
接入应用以后,会在用户使用应用的过程中,将上述行为一一收集起来。等到捕获到异常时,会将收集到的用户行为和异常信息一起上报。那 Sentry
是怎么实现收集用户行为的呢?答案: 劫持覆写上述操作涉及的 api
。
二、页面跳转
收集页面跳转行为: 为了可以收集用户页面跳转行为,Sentry
劫持并覆写了原生 history
的 pushState
、replaceState
方法和 window
的 onpopstate
。
2.1 pushState
// 保存原生的 pushState 方法
var originPushState = window.history.pushState;
// 劫持覆写 pushState
window.history.pushState = function() {
var args = [];
for (var i = 0; i < arguments.length; i++) {
args[i] = arguments[i];
}
var url = args.length > 2 ? args[2] : undefined;
if (url) {
var from = lastHref;
var to = String(url);
lastHref = to;
// 将页面跳转行为收集起来
triggerHandlers('history', {
from: from,
to: to,
});
}
// 使用原生的 pushState 做页面跳转
return originPushState.apply(this, args);
}