/webfunny_monitor

通过向html页面中插入一段简单的JS探针代码，实现无埋点监控前端页面的用户行为，包括但不限于 PV/UV、报错日志、请求日志、静态资源加载情况、用户点击行为以及截图信息等等，目的在于帮助前端开发提高解决线上问题的效率。页面DEMO:

Primary LanguageJavaScript

前言

怎样定位前端线上问题，一直以来，都是很头疼的问题，因为它发生于用户的一系列操作之后。错误的原因可能源于机型，网络环境，复杂的操作行为等等，在我们想要去解决的时候很难复现出来，自然也就无法解决。 当然，这些问题并非不能克服，让我们来一起看看如何去监控并定位线上的问题吧。

暂停部署

本项目将会在2月15日之前发布新版本，会有更好的使用体验。大家可以暂停部署当前这个版本。

部署

total gzip size

只需要简单几步就可以搭建一套属于自己的前端监控系统，欢迎关注和Star。

【监控系统效果】 | 【开源说明】 | 【微信号】webfunny_2020

主体功能

  1. 监控JS报错、http接口报错、静态资源加载报错等；记录页面访问、点击事件、接口请求等行为日志；

  2. 统计PV/UV数据、用户7天留存数据、版本号/机型/地域分布数据

  3. 提供报错具体查找和定位功能、用户详细行为追踪与分析功能、用户网络环境评估功能

  4. 提供额外上报接口，上报自定义日志

目录结构

     ./A-monitor-code/webmonitor.js   探针代码
     ./schema  数据库建表结构
     ./views/ 前端展示代码
     ./config  数据库配置目录
     ./logs  运行报错日志目录
     ./config.js 接口配置文件

更新计划：更新排期计划表

贡献者支持

开发了这么久，也是颇有一番感慨。 一叹，前辈高人技艺之精湛；二叹，开源世界心胸之广阔；正是有这些无私奉献的大牛们，才让这技术的世界多姿多彩。

一颗star, 一份关注, 都将是我前进的动力 :)

效果预览

首页简介