webfunny前端监控平台新增功能教程:获取小程序、uni-app探针安装

742

Webfunny现在支持微信小程序、uni-app的监控探针了,两个平台安装探针的方式很相似,具体操作下面就给大家分享一下。

微信图片_20210519231154.png

一、微信小程序探针安装

(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

Webfunny专注于微信小程序、H5前端、PC前端线上应用实时监控,实时监控前端网页、前端数据分析、错误统计分析监控和BUG预警,第一时间报警,快速修复BUG!支持私有化部署,容器化部署,可支持千万级PV的日活量 !!