Webfunny现在支持微信小程序、uni-app的监控探针了,两个平台安装探针的方式很相似,具体操作下面就给大家分享一下。
一、微信小程序探针安装
(1)首先创建一个微信小程序项目
(2)项目生成后,复制探针代码。在小程序项目的 utils 目录下创建一个js文件,命名为:webmonitor.mp.min.js,并将探针代码复制到这个文件中保存。
(3)在小程序项目中找到app.js文件,通过以下方式初始化webfunny的监控代码。
require("./utils/webmonitor.mp.min")
/**
* 初始化用户信息
* @param userId 用户唯一性标识 (手机号、用户名、id等)
* @param userTag 用于区分同一个项目下,角色的分类(公司A, B, C, D等)
* @param projectVersion 应用每次发布的版本号
*/
wx.setStorageSync('wmUserInfo', JSON.stringify({userId: "userId1", userTag: "A", projectVersion: "1.0.1"}))
App(wx.webfunny({
onLaunch: function () {
console.log('App Launched')
},
onShow: function () {
console.error("App show")
},
onHide: function () {
console.log('App Hide')
},
onError: function (e) {
},
globalData: {
hasLogin: false
}
}))
(4)区分不同环境
/**
* 可以根据环境来引入不同的探针代码
*/
require("./utils/webmonitor.mp.min")
好了,这样就OK了。
二、uni-app探针安装教程
(1)首先创建一个uni-app项目
(2)项目生成后,复制探针代码。在小程序项目的 utils 目录下创建一个js文件,命名为:webmonitor.mp.min.js,并将探针代码复制到这个文件中保存。
(3)在uni-app的项目中找到App.vue文件,通过以下方式初始化webfunny的监控代码。注意:跟微信小程序的方式还是有一点区别的。
require("./utils/webmonitor.mp.min.js");
/**
* 初始化用户信息
* @param userId 用户唯一性标识 (手机号、用户名、id等)
* @param userTag 用于区分同一个项目下,角色的分类(公司A, B, C, D等)
* @param projectVersion 应用每次发布的版本号
*/
wx.setStorageSync('wmUserInfo', JSON.stringify({userId: "userId1", userTag: "A", projectVersion: "1.0.1"}))
export default {
...uni.webfunny({
onLaunch: function() {
console.log("我运行了")
},
onError: function(e) {
console.log('我报错了', e)
},
onShow: function() {
console.log('show')
},
onHide: function() {
console.log('App Hide')
}
})
}
(4)区分不同环境
/**
* 可以根据环境引入不同的探针代码
*/
require("./utils/webmonitor.mp.min.js");
好了,按照以上操作全部指引之后,整个webfunny前端监控项目在uni-app的探针就部署好了
关于Webfunny
Webfunny专注于微信小程序、H5前端、PC前端线上应用实时监控,实时监控前端网页、前端数据分析、错误统计分析监控和BUG预警,第一时间报警,快速修复BUG!支持私有化部署,容器化部署,可支持千万级PV的日活量 !!