- 博客(44)
- 收藏
- 关注
RSS订阅原创 如何快速搭建一套属于自己的埋点系统？
今天给大家分享下埋点系统如何进行创建使用？毕竟埋点创建好上报后，是需要直观的展现出来数据，所以今天来介绍一下如何快速搭建属于自己的一套埋点系统，比如怎么建点位、卡片、进行数据分析等。在开始介绍前先介绍下，让新同学快速了解这个产品是一个轻量级、易使用，埋点分析一体化的产品，用户可以根据自己的需求，创建不同的埋点，选择不同的图形在数据看板中来展示分析数据，我们支持单个数据的展示，有适用于体现数据的变化趋势，也有适用于体现总量和比率，还支持多个数据进行重叠展示等等。
2024-08-11 20:14:29
711
原创 webfunny埋点系统创建数据分析
之前给大家分享过如何哟个webfunny快速搭建属于自己的埋点系统，j利用点位字段创建好卡片进行数据展示，今天给大家演示下埋点系统进行数据分析卡片创建完成后的DEMO，比较直观帮助大家了解不过DEMO只是演示，具体的业务分析还需要根据实际情况进行字段点位创建，创建完成后根据要看的业务数据分析目标在进行具体看数。
2024-08-11 20:12:48
321
原创 clickhouse使用clickhouse-backup来本地和远程备份文件
【代码】clickhouse使用clickhouse-backup来本地和远程备份文件。
2024-08-04 19:11:49
193
原创 webfunny埋点系统如何进行部署？
hello 大家webfunny埋点系统做了不少功能更新，平常给大家分享比较多的是****，最近有不少技术同学来了解webfunny埋点系统，今天主要给大家分享下webfunny埋点系统部署，分为本地部署和线上部署。还没有试用和部署过webfunny埋点系统的同学，可以跟着下面部署引导，在上进行demo试用部署实操。
2024-08-04 19:02:47
853
原创 Webfunny白屏检测方案（附操作介绍）
页面白屏，绝对是让前端开发者最为胆寒的事情，特别是随着 SPA 项目的盛行，前端白屏的情况变得更为复杂且棘手起来。2、判断17这个采样点是否在该容器集合中，就是判断这17个位置下有没有dom元素，如果都没有，则说明白屏了，同时开启轮询检测，来确保白屏检测结果的正确性，直到页面的正常渲染。依据平均值，可以通过DOM数量来辅助判断白屏和业务白屏的方式，提升白屏判断的准确性。复现难度高，面对这样的问题，内心很虚，因为导致白屏出现的原因非常多，这不是一个明确的错误，如果没有好用的监控工具，真不知道该从何入手。
2024-07-13 20:32:29
683
原创 ClickHouse备份方案
对于大规模生产环境，通常推荐使用clickhouse-backup工具进行自动化备份管理，因为它提供了更全面的功能和更好的灵活性。这个工具由Altinity维护，支持全量备份、增量备份、恢复、备份加密、备份验证等功能。这是一种在线备份的方式，不会影响表的正常使用，但需要手动管理备份文件，并且更适合小规模或特定场景下的备份需求。这种方式提供了在线备份的能力，适合小规模数据或部分数据的备份。命令创建增量备份，仅备份自上次备份以来变化的数据。**全量备份：**使用。**增量备份：**使用。
2024-06-23 17:38:59
512
原创 Webfunny【用户细查】七项功能升级更新：大幅提升用户排查效率！
为了提升用户细查的使用体验，我们在查询时间范围、查询时间颗粒度、筛选条件、布局和呈现方式等地方做了大量的改动和优化；同时，增加了用户历史足迹、白屏检测能力、用户使用体验评估、丰富了基础信息内容，极大的提高了排查问题的效率。
2024-06-23 17:34:18
470
原创 Nginx代理配置（专业版）
注意：监控系统只是运行代码，是否支持https，需要运维同学在你们的服务器上配置https证书，配置好证书，就可以支持https了。常见问题：很多同学配置好了https证书，但是上报接口用的还是http。webfunny的探针是根据监控项目的网址来判断的，你的。以上是webfunny<Nginx代理配置>操作介绍, ps： 如果你是前端工程师的相关技术同学，欢迎试用体验**写在前面提醒：使用代理，如果可以，请尽量支持双协议，http、https均要支持哈。，上报接口也会切换到https。
2024-05-26 12:15:26
467
原创 如何优化解决React + Antd + Wepack 项目体积大问题！！
Hello，大家下午好，今天想给大家分享一期webfunny优化的功能。主要是最近陆续有一些小伙伴向我们反馈，webfunny页面加载速度比较慢，且偶尔会出现页面崩溃的情况。刚开始我是不大相信的，因为在我的电脑上访问，运行都是很正常的，直到我把浏览器文件的压缩对比打开后，才发现：经过这么长时间的功能迭代，前端项目打包的体积已经变得如此臃肿了！！！非常惭愧，是我们疏忽了这点！接下来我们将对，争取能够给大家一个更好的使用体验。如果你也想知道线上应用的响应时长，也可以监控一下试试，看看效果。
2024-05-26 12:10:30
831
原创 如何快速实现微信公众号扫码关注完成登录（附：超详细操作流程）
Hello，大家好，欢迎使用Webfunny前端监控和埋点平台。今天，我们来详细介绍一下关注微信公众号后，并完成登录的详细流程。微信登录广为人知了，涉及到订阅号，公众号，小程序等，他们各自登录流程有和区别，很多同学可能不甚清楚。我也是经过一番调研和倒腾才搞明白了是怎么回事，特此记录，以供大家了解和学习。微信公众平台用于管理、开放微信公众号（包括订阅号、服务号、企业号），简单的说就是微信公众号的后台运营、管理系统。
2024-05-19 12:53:07
3331
原创 【监控探针】H5监控探针，npm安装方法，4步轻松搞定
企业版、H5探针、npm包（@webfunny/monitor）hello，小伙伴们，为了方便大家引入探针，我们提供了npm包供大家下载。
2024-05-19 12:34:51
551
原创 手把手教你搭建Gitlab服务器，避免踩坑！
停止Gitlab在进行卸载之前，需要先停止GitLab服务以确保其正在运行。你可以使用以下命令停止GitLab服务：卸载Gitlab如果你是使用 Debian/Ubuntu 通过 apt 安装的 GitLab，则可以使用以下命令卸载：其他安装方式可以参考这个文档进行卸载。好了，以上就是gitlab安装的完整教程了，我相信你也能很轻松部署一套gitlab服务器的。PS： 如果你是前端工程师同学，欢迎试用体验【webfunny前端监控系统】。欢迎试用体验【webfunny前端监控系统】
2024-04-23 20:30:00
1273
原创 Webfunny埋点系统如何统计留存率
Hello，大家好，有小伙伴想要咨询该如何统计，今天我们就来讲一讲吧。首先，我们以次日留存率来作为示例讲解说明，3日，7日留存率也是同理的。示例场景：用户第一天前来注册，第二天又回来登录的用户为目标用户，计算用户的次日留存率。
2024-04-23 14:00:00
317
原创 Docker容器化部署（企业版）
大家好，webfunny前端监控埋点系统，已经正式发布了目录：https://hub.docker.com/r/webfunny/webfunny_monitor_cluster/tags部署前提是你的服务器已经安装了Docker环境，没有安装docker环境的可以参考这篇安装文档。
2024-04-21 17:09:04
842
原创 【埋点探针】UniApp-SDK安装
给大家分享**webfunny埋点系统**最新功能更新——【埋点探针】UniApp-SDK安装，按照下面步骤开始操作吧。
2024-04-21 16:57:46
386
原创 【埋点探针】微信小程序SDK安装
点位上报完成后，可以在点位测试里验证是否上报成功了。选择点位后，如果能搜索出结果，则说明点位上报成功了。在项目根目录下，创建sdk文件，webfunny.event.js。点位上报十分方便，只需要将下边的点位信息复制下来，放入代码中即可。埋点SDK引入后，则可以开始上报点位信息了。如果你是前端工程师同学，对埋点系统想要实操，选择Wechat，复制sdk代码。
2024-04-21 16:52:00
691
原创 Webfunny前端监控如何接入飞书单点登录（SSO）
Hello，大家好，欢迎使用****。今天我们将介绍一下如何接入飞书的登录系统。友情提示：如果飞书侧已经配置好了，可以直接跳到第六步阅读。
2024-04-21 16:09:20
1213
原创 Webfunny大版本改造（mysql迁移至clickhouse)
前段时间，都在忙着改造webfunny的clickhouse版。改造的内容非常之多，工作量非常之大，以至于有些技术小伙伴提的优化建议、在那段时间暂时被搁置，除非是比较严重的bug。好在经过几个月的加班加点改造到上线，目前版本使用下来效果还是可以的，也没有浪费我们投入这么多时间，现在也在着力优化小伙伴们之前提的建议，。
2024-04-21 15:48:36
886
原创 如何搞定前端异常监控？
用户在使用应用时，可能会遇到预期之外的结果。不同的异常情况带来的后果也会有所不同，有些可能只会让用户感到不满意，而有些则可能导致产品无法正常使用，从而使用户失去对产品的信任。
2024-04-06 20:06:10
785
原创 如何定位和解决：前端经常出现Script error
Hello，大家好。。Script error.这个错误非常的高傲和神秘，为什么呢？因为它出现的时候，不会给你提供任何有关它的线索。正常我们写的前端代码报错的时候，浏览器通常抛出错误代码的行列号，以及它的堆栈代码，这样我们就可以快速定位到错误的位置。而这个错误发生的时候，连根毛的线索都没有提供，有毛的线索吗 ，一根都没有。那么它凭什么这么嚣张呢？
2024-04-06 19:18:28
2069
原创 教你怎么区分并应用埋点：前端-埋点的定义、分类及用途介绍
数据埋点是一种重要的数据采集方法，其主要目的是记录和收集终端用户的操作行为。其基本原理是在App/H5/PC等终端上部署采集的SDK代码，当用户的行为满足特定条件（如进入某个页面、点击某个按钮）时，会自动触发记录和存储操作。随后，这些数据会被收集并传输给终端提供商，或用于后端采集用户使用服务过程中的请求数据。
2024-03-24 15:52:34
1430
原创 webfunny用户行为深度解析：埋点系统热力图全面分析
热力图是以特殊高亮的形式显示用户页面点击位置或用户所在页面位置的图示，是一种非常好用的工具，一图抵千言，借助热图，可以直观地观察到用户的总体的偏好。热力图本质上是一个数值矩阵，图上每一个色块都是一个数值，通过离散数值、权重算法与分析模型等技术手段，将用户行为频度以色块的形式展现出来。通过可视化的效果呈现，帮助产品经理（分析师）深入分析用户对内容及功能的访问情况、操作习惯、行为偏好等。下图热力效果的经典案例，谷歌首页点击热力图的效果，所见即所得，红色是黄金地段。
2024-03-24 15:29:18
1079
原创 webpack之url-loader快速转换Base64
众所周知可以全局配置url-loader，对一些静态资源的超过设定目标转换成base64,直接打包的时候打在js文件中，能更快的响应。然在某些特定的环境，需要单独的对一些超过之前设定的目标大小，但是又不想改变全局设定，如何让特殊的某个或某几个文件也能变成base64............
2022-07-24 22:49:48
838
1
原创 Webfunny系统更新至3.0.84：优化了小程序，Uni-app探针的配置等
Webfunny 前端异常监控服务Webfunny提供专业的前端异常监控服务，我们的插件可以提供全方位的异常监控，可以帮助开发者第一时间定位各种前端异常，针对前端使⽤场景专⻔研发，适应更多⾼并发场景。并且，Webfunny 可以部署在任何地⽅，监控数据可以回流，监控⽇志存储在本地数据库，⽆⻛险；不限制创建应⽤个数和应⽤流量，可⾃定义⽇志存储时间 ，Webfunny 帮助开发者快速复现 BUG，提高 bug 修复效率。Webfunny前端监控系统更新版本：3.0.53- 3.0.84最新版本：3.0
2022-05-12 21:38:25
330
原创 问卷调查设计-SurveyJS的使用教程
最近在帮忙设计一款关于APP上可以进行问卷调查的任务，于是网上搜索的相关知识，找到了survey.io这个前端组件，用起来感觉很不错，推荐给大家使用。一、优点： SurveyJS完全可定制的调查、表格和测验，无缝集成到您的应用程序中。SurveyJS 超越了基于云的调查• 在您的应用程序中嵌入调查• 将调查创建者添加到您的应用程序• 实施您自己的数据存储二、SurveyJS的使用去SurveyJS官网注册创建自己的账号，用来实时保存自己编辑的文件，地址：https://surveyjs..
2022-05-10 21:40:33
1365
2
原创 Webfunny系统更新至3.0.84：优化了小程序，Uni-app探针的配置能力等
Webfunny 前端异常监控服务Webfunny提供专业的前端异常监控服务，我们的插件可以提供全方位的异常监控，可以帮助开发者第一时间定位各种前端异常，针对前端使⽤场景专⻔研发，适应更多⾼并发场景。并且，Webfunny 可以部署在任何地⽅，监控数据可以回流，监控⽇志存储在本地数据库，⽆⻛险；不限制创建应⽤个数和应⽤流量，可⾃定义⽇志存储时间 ，Webfunny 帮助开发者快速复现 BUG，提高 bug 修复效率，欢迎大家免费试用~更新版本：3.0.53- 3.0.84最新版本：3.0.84更
2022-05-10 19:49:10
193
原创 浅谈react-router-dom V6的配置使用
最近在搭建PC项目的React框架，涉及到React Router，开发同学有时就需要去尝试点新的东西，在开发过程中才不会枯燥的，基于这个理念推动，就在搭建的时候用V6的版本开始了（虽然只是个新版本，也不算啥新东西）…V6的版本相对于V5,做了很多的优化，有书写方面的、路由的嵌套、路由配置化、鉴权方面等等，下面就简单的介绍下如何使用一、关于书写方面路由注册的时候由的Switch改为了Routes//V5版本 import {Route, Switch} from 'react-router-dom
2022-05-09 11:30:00
680
原创 react-router-dom V6的配置使用
最近在搭建PC项目的React框架，涉及到React Router，开发同学有时就需要去尝试点新的东西，在开发过程中才不会枯燥的，基于这个理念推动，就在搭建的时候用V6的版本开始了（虽然只是个新版本，也不算啥新东西）…V6的版本相对于V5,做了很多的优化，有书写方面的、路由的嵌套、路由配置化、鉴权方面等等，下面就简单的介绍下如何使用一、关于书写方面路由注册的时候由的Switch改为了Routes//V5版本 import {Route, Switch} from 'react-router-do
2022-05-08 17:27:03
1439
1
原创 浅谈：React Hooks 异步操作
Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性，Hook 不会影响你对React概念得理解。恰恰相反，Hook 为已知的 React 概念提供了更直接的 API：props， state，context，refs 以及生命周期。稍后我们将看到，Hook 还提供了一种更强大的方式来组合他们。从而使得函数式组件从无状态的变化为有状态的。React 的类型包 @types/react 中也同步把 React.SFC (St
2022-05-08 15:48:54
2025
原创 使用vue-cli快速搭建 vue3.0项目
1.介绍Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，提供：通过 @vue/cli 实现的交互式的项目脚手架。通过 @vue/cli + @vue/cli-service-global 实现的零配置原型开发。/cli-service)，该依赖：可升级；一个运行时依赖 (@vue基于 webpack 构建，并带有合理的默认配置；可以通过项目内的配置文件进行配置；可以通过插件进行扩展。一个丰富的官方插件集合，集成了前端生态中最好的工具。一套完全图形
2022-04-28 23:37:45
1057
原创 如何优雅的让小程序的request请求支持callback & Promise的写法?
前言随着Promise在被广泛的使用和解决回调地狱的问题，以至于我们只要在发ajax请求的时候就会想起来去使用它。最近在使用小程序的请求request就想当然的使用then的方式来获取结果，然并卵。。。于是就去小程序官网巴拉下资料小程序文档链接， 仔细翻阅得到结果如下：异步 API 返回 Promise基础库 2.10.2 版本起，异步 API 支持 callback & promise 两种调用方式。当接口参数 Object 对象中不包含 success/fail/complete 时将默
2022-04-28 23:21:51
381
原创 如何优雅的让小程序的request请求支持callback & Promise的写法
前言随着Promise在被广泛的使用和解决回调地狱的问题，以至于我们只要在发ajax请求的时候就会想起来去使用它。最近在使用小程序的请求request就想当然的使用then的方式来获取结果，然并卵。。。于是就去小程序官网巴拉下资料小程序文档链接， 仔细翻阅得到结果如下：异步 API 返回 Promise基础库 2.10.2 版本起，异步 API 支持 callback & promise 两种调用方式。当接口参数 Object 对象中不包含 success/fail/complete 时将默
2022-04-24 10:00:00
402
原创 轻松教你学会 Docker镜像仓库的使用
关于【Docker Hub】背景：Docker Hub 是一个由 Docker 公司运行和管理的基于云的存储库。它是一个在线存储库,Docker 镜像可以由其他用户发布和使用。有两种库：公共存储库和私有存储库。如果你是一家公司，你可以在你自己的组织内拥有一个私有存储库,而公共镜像可以被任何人使用。一、在Docker Hub上创建自己的存储库repository镜像保存在Registry的仓库中，默认的Registry是由Docker公司运营的公共Registry服务，即Docker Hub，网址为：
2022-04-11 11:00:00
1437
原创 webfunny埋点探针更新：支持微信小程序、uni-app埋点SDK集成
Webfunny现在支持微信小程序、uni-app的埋点探针了，两个平台集成探针的方式很相似一、微信小程序的集成（1）如何下载对应点位的SDK如下图操作（2）下载对应的wechat sdk后，复制SDK代码。在小程序项目的 utils 目录下创建一个js文件，命名为：webfunny-track.wx.umd.js，并将SDK代码复制到这个文件中保存。（3）在小程序项目中找到app.js文件，通过以下方式初始化SDK代码，并调用即可。//1、在项目主入口app.js中添加如下代码impor.
2022-03-02 21:56:17
529
原创 webfunny警报设置：如何快速验证警报是否有效？
大家好，经常会有小伙伴在使用webfunny监控系统中，遇到无法触发警报的问题，其实都是一些配置上的疏漏，在这里给大家总结一下：PS：只要消息中心里有警报，则说明触发机制没有问题。其他方式没有触发，一般都是配置的问题一、如何快速验证警报是否有效？经常会有小伙伴询问为什么不触发警报，是不是程序有问题，不如设置个最低阀值看一下。如何快速验证，最好的办法就是把触发条件设置最低，如下图所示；这样每隔1分钟，都会触发一次警报。二、为什么消息中心里有警报，而邮箱里没有？1）默认邮箱：小伙伴们部署的系统，默
2022-02-14 10:00:00
266
原创 Webfunny前端监控功能分享：如何解析源码？
大家好，期待已久的sourceMap功能终于上线了，功能还需要进一步优化，但是也可以提前和大家见面了。目前支持：webpack4.0 + 打包的代码， 如果有webpack2.0+版本的用户，可以联系webfunny技术同学单独处理~好了，话不多说，让我们来看看如何使用webfunny来定位源码吧。一、区分线上打包和源码的sourceMap文件1）正常情况下，我们打包发布的文件中，一般会生成两个文件，xxx.min.js、xxx.min.js.map；一个是我们打包的压缩js文件，一个是我们sour
2021-12-05 12:44:37
495
原创 如何快速搭建一套属于自己的埋点系统，看这里有详细部署操作文档
webfunny新产品——点位系统上线啦~欢迎使用webfunny的埋点系统，它是一个轻量级、易使用，埋点分析一体化的产品，用户可以根据自己的需求，创建不同的埋点，选择不同的图形在数据看板中来展示分析数据；webfunny支持单个数据的展示，有适用于体现数据的变化趋势，也有适用于体现总量和比率，还支持多个数据进行重叠展示等等。下面介绍一下如何快速搭建属于自己的一套埋点系统。分为下面几个主要步骤：创建点位字段–创建点位–创建SDK–创建项目–创建卡片–引入探针–分析数据一、点位字段点位字段又叫埋
2021-11-09 22:31:46
1951
原创 webfunny前端监控埋点部署教程技术分享：5步教你快速部署埋点系统
提示：部署前可以先查看webfunny相关文档环境要求请安装NodeJS，版本号：10.6.0及以上。第一步、下载(clone)最新部署包，初始化1.本地克隆代码$：' git clone https://github.com/a597873885/webfunny_event.git '使用码云仓库$：' git clone https://gitee.com/webfunnyMonitor/webfunny_event.git '（github网络不稳定，可以使用码云地址）2.在项目根.
2021-11-07 21:24:01
941
原创 实时流量大屏幕存在的必要性！详见操作文档
实时流量大屏，是用来监控前端项目上线质量的。更新周期：1分钟；具体效果可看：Demo预览如大家所知，监控系统会监控线上应用的各项指标，如：错误，白屏，耗时等等，但是仔细一想，即使有这些监控，我们也不一定能够保证线上的应用是安全的。为什么？比如，当你上线了某个功能后，页面一切正常，但是某个流程无法进行了，这时候各项监控系统都不会有任何感知，即使你感知到，那也是一、两个小时之后的事情了，对于流量较大的应用来说，这个损失可不小。时间越长，开发者也要承担越大的责任。所以，webfunny上线了实时流量大
2021-09-05 10:33:16
158
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人