怎样定位前端线上问题,一直以来,都是很头疼的问题,因为它发生于用户的一系列操作之后。错误的原因可能源于机型,网络环境,复杂的操作行为等等,在我们想要去解决的时候很难复现出来,自然也就无法解决。 当然,这些问题并非不能克服,让我们来一起看看如何去监控并定位线上的问题吧。
- 稳定运行,欢迎试用。
- 定期维护,保证准确率。
- 敏感信息加密,功能不断升级。
-
前端异常上报【完成】
-
用户PV/UV统计【完成】
-
页面加载时间统计【完成】
-
用户点击行为统计【完成】
-
接口请求日志统计【完成】
-
接口请求耗时统计【完成】
-
静态资源加载异常统计【完成】
-
实现JS页面截图【完成】
-
自定义日志上传【完成】
将要增加的上报功能:
1)接口增加参数和返回结果的统计(敏感信息加密)
2)增加应用版本号字段,排查因发布造成的bug
3)增加页面加载性能相关信息上报
4)即将增加录屏功能测试
-
js报错实时监控【完成】前往
-
js报错的统计分析【完成】
-
js报错的详情分析和代码定位【完成】
-
静态资源加载异常实时监控【完成】前往
-
静态资源加载异常的统计分析【完成】
-
接口请求报错实时监控【完成】前往
-
接口请求报错的统计分析【完成】
-
用户pv/uv实时统计【完成】
-
记录回放功能(详细记录用户使用的足迹)【完成】前往
将要增加的分析功能:
1)增加7日内留存数据分析
2)增加版本号分析,浏览器分布,等信息分析
3)分析页面加载性能数据
具体内容:请移步线上监控系统
-
前往 新建应用
-
命令行:$ npm install webfunny-monitor --save-dev
-
var wm = require("webfunny-monitor"); wm.initMonitor("应用ID", "userId", "1.0.0");
如果有问题,欢迎提问。
一颗star, 一份关注, 都将是我前进的动力 :)
监控系统的探针代码