56496477/webfunny_monitor

前端监控探针代码； 通过监控记录前端用户的PV/UV，用户行为，接口请求，js错误日志，页面截图等信息，帮助排查线上用户问题， 检查前端项目质量，提升用户体验等；页面DEMO:

阅读须知

1. webmonitor.js 为探针的源码

2. /resource/fetchCode.js 为fetch的源码

3. /resource/html2canvas0.js 为截图插件的源码

讲解须知

监控系统的探针代码

点击前往线上Demo

点击前往博客讲解

如果实在嫌部署麻烦，Demo系统可以提供7天的监控量，我会长期维护，点击跳转

探针部署方式：

1. 根目录下执行命令$: webpack 得到一个压缩js文件(探针) lib/monitor.fetch.html2.min.js， lib/monitor.fetch.min.js

2. 将探针代码插入到html页面head的最顶部

   ...

   <script type="text/javascript"> ...此处放置监控代码... </script>

   ...

3. 启动mysql数据库，如果使用远程数据库可以参考教程：

   Mysql数据库的安装和使用

4. 启动node服务器，可以参考教程：

   搭建前端监控系统（三）NodeJs服务器部署篇

   源码：NodeJs后台服务

5. 启动分析平台界面，可以参考教程（README.md）：

   源码：React数据可视化

如果有问题，欢迎提问。

系统简介

前端错误统计

错误详情分析

用户行为检索