怎样监控手机微信小程序记录

基础使用方法

基础方法包含获取微信小程序监控SDK并初始化、上报和设置安全域名这三个步骤：

获取微信小程序监控SDK并初始化：

在微信小程序/utils目录下新建wxLogger.js文件，并将JS文件的内容复制并粘贴至新建的wxLogger.js文件中。

在/utils目录下新建monitor.js文件，并将以下内容添加至新建的monitor.js文件中以完成初始化。

说明 您可以自定义JS文件的名称和存放位置。

如果项目使用node module (require) 方式集成，则添加以下内容：

const WXLogger = require('./wxLogger.js')

const Monitor = WXLogger.init({

pid: 'xxx',

region: 'cn',// 指定应用部署的地域：中国设为cn，海外地区靠近新加纤春岁坡的设为sg。

})

export default Monitor

如果项目使用ES module (import) 方式集成，则添加以下内容：

import WXLogger from './wxLogger.js'

const Monitor = WXLogger.init({

pid: 'xxx',

region: 'cn',// 指定应用部署的地域：中国设为cn，海外地区靠近新加坡的设为sg。

})

export default Monitor

说明 关于参数的详细配置，请参见通用SDK配置项。

使用以下方法静默采集PV、Error、API、性能及Health数据：

在app.js中，使用Monitor.hookApp(options)方法静默捕获Error类日志。其中的options即为App层相应的Object配置。

import Monitor from '/util/monitor'

App(Monitor.hookApp({

onError(err) {

console.log('进入onError:', err)

},

onLaunch() {

console.log('进入onLaunch')

},

onShow(options) {

},

onHide() {

}

}))

在page的JS文件中通过Monitor.hookPage(options)方法静默上报API请求、PV、Health数据。

import Monitor from '/util/monitor'

// 使用hookPage后，生命周期的API会自动打点。

Page(Monitor.hookPage({

data: {},

onLoad(query) {

},

onReady() {

// 页面加载完成。

},

onShow() {

},

onLoad(query) {

},

onHide() {

},

onUnload() {

}

}))

设置安全域名：

如果region设为cn，则将https://arms-retcode.aliyuncs.com添加到Request合法域名。

如果region设为sg，则将https://arms-retcode-sg.aliyuncs.com添加到Request合法域名。

API方法：静默打点基础API

方法 参数 备注 示例使用场景

hookApp {} 请传入原有的App参数。 在App的生命周期中自动打点。

hookPage {} 请传入原有的Page参数。 在Page的生命周期中自动打点。

说明 小程序监控项目如需使用hookApp、hookPage嵌入生命周期打点，必须符合标准小程序关于App和Page的规范，即森链App层有onError，Page层有onShow、onHide、onUnload。使用方法毁睁示例，请参见基础使用方法。

API方法：其他设置API

方法 参数 备注

setCommonInfo {[key: string]: string} 设置日志基础字段，可用于灰度发布等场景。

setConfig {[key: string]: string} 设置config字段，具体 *** 作，请参见SDK参考。

说明 对于setConfig方法，小程序场景不支持配置uid，您可以使用setUsername代替uid标识用户。

pageShow {} Page Show打点，发送PV数据。

pageHide {} Page Hide打点，发送Health数据。

error String/Object 错误日志打点。

api 请参见API参考 API类日志上报。

sum/avg String 自定义求和、求均值日志上报。

进阶场景

当基础使用方法无法满足需求时，请参见以下进阶场景：

手动上报API相关信息（不采用静默上报方式）：

将disableHook设为true，不静默上报wx.request请求的日志。

手动调用api()方法上报API相关信息。

取消静默上报并改为手动打点：

在App和Page对应的JS文件中不再使用hookApp、hookPage方法。

如需发送当前页面的PV数据，则在Page的onShow方法下调用pageShow()方法。

说明 请勿与hookPage()方法同时使用此方法，否则会造成PV类日志重复上报。

import Monitor from '/util/monitor'

Page({

onShow: function() {

Monitor.pageShow()

}

})

如需发送当前页面的Health类数据，统计当前页面的健康度和页面停留时间，则在Page的onHide和onUnload方法下调用pageHide()方法。

说明 请勿与 hookPage()方法同时使用此方法，否则会造成日志重复上报。

import Monitor from '/util/monitor'

Page({

onHide: function() {

Monitor.pageHide()

},

onUnload: function() {

Monitor.pageHide()

}

...

})

通用SDK配置项

ARMS前端监控提供一系列SDK配置项，让您能够通过设置参数来满足额外需求。以下是适用于本文场景的通用配置项。

参数 类型 描述 是否必选 默认值

pid String 项目唯一ID，由ARMS在创建站点时自动生成。 是 无

uid String 用户ID，用于标识访问用户，可手动配置，用于根据用户ID检索。如果不配置，则由SDK随机自动生成且每半年更新一次。 否 由SDK自动生成

tag String 传入的标记，每条日志都会携带该标记。 否 无

release String 应用版本号。建议您配置，便于查看不同版本的上报信息。 否 undefined

environment String 环境字段，取值为：prod、gray、pre、daily和local，其中：

prod表示线上环境。

gray表示灰度环境。

pre表示预发环境。

daily表示日常环境。

local表示本地环境。

否 prod

sample Integer 日志采样配置，值为1~100的整数。对性能日志和成功API日志按照1/sample的比例采样，关于性能日志和成功API日志的指标说明，请参见统计指标说明。 否 1

behavior Boolean 是否为了便于排查错误而记录报错的用户行为。 否 false

enableLinkTrace Boolean 进行前后端链路追踪，请参见使用前后端链路追踪诊断API错误原因。 否 false

ARMS前端监控还提供了更多SDK配置项，可满足进一步的需求。更多信息，请参见SDK参考。

小程序监控是可以有录音功能的，这个是需要我们自己去根据自己录音的要求进行软件的编撰，从而达到录音的目的。

资料补充：

代码如下：

data数据

data:{

playerState: 0, //0-录音 1-播放

voice: "", //录音地址

voiceType: false, //录音切换

beginAndEnd: "请语音录入",}

image.png

image.png

image.png

image.png

开始录音

tape() {

if (this.data.playerState == 0) { //等于0，进行录音功能

//正在录音点击后就结束录音，图标也该为播放图标，功能改为播放

if (this.data.voiceType) {

//结束录音

this.setData({

voiceType: false,

src: '/assets/imgs/player.png'

})

this.end() //调用结束录音的方法

} else {

//开始录音

this.setData({

src: '/assets/imgs/voiceEnd.png',

beginAndEnd: "结束语音录入",

voiceType: true

})

wx.showToast({

title: '正在录音。。。',

icon: 'none',

duration: 60000

})

const options = {

duration: 60000, //祥则录音的时长

sampleRate: 44100, //采样率

numberOfChannels: 1, //录音通道数

encodeBitRate: 192000, //编码码率，有效值见下表格

format: 'wav', //音频格式

frameSize: 50 //指定帧大小，单位 KB。传入 frameSize 后，每录制指定帧大小的内容后，会回调录制的文件内容，不指定则不会回调。暂仅支持 mp3 格式。

}

wx.getRecorderManager().start(options) //开始录音

var num = 0

this.data.interval = setInterval(() =>{ //限时录音60s

num++

if (num >59) { //到60s调用停止录音方法

this.end()

}

}, 1000)

}

} else { //不等0也就是1，进行播放

if (this.data.voiceType) {

this.setData({

voiceType: false,

src: '/assets/imgs/player.png',

beginAndEnd: "播放录音"

})

innerAudioContext.stop() //停止。停止后的音频再播放会从头开始播放。

} else {

this.setData({

voiceType: true,

src: '/assets/imgs/stop.png',

beginAndEnd: "停止播放"

})

//音频的数据链接，用于直接播放，仅支持绝对路径。

innerAudioContext.src = this.data.voice

innerAudioContext.play() //播放

innerAudioContext.onEnded(() =>{ //监听音频自然播放至结束的事件

innerAudioContext.stop() //停止。

this.setData({

voiceType: false,

src: '/assets/imgs/player.png',

beginAndEnd: "播放录音"

})

})

}

}

},

结束录音

//结束录音

end() {

clearInterval(this.data.interval) //清除定时器

wx.hideToast() //隐藏正则录音的图搏洞标

wx.showToast({

title: '录音结束。。。',

icon: 'none',

duration: 2000

})

this.setData({

beginAndEnd: "播放语音",

playerState: 1,

voiceType: false

})

var that = this

//监听录音结束事件谨银棚

wx.getRecorderManager().onStop(res =>{

console.log(res)

//调用自定义事件，把音频上传并返回音频路径

const {

uploadRecord } = require('../../../http/picture.js')

uploadRecord(res.tempFilePath).then(res =>{

console.log(res)

that.setData({

voice: JSON.parse(res).data,

state: 1

})

})

})

wx.getRecorderManager().stop() //停止录音

},

作者：Flipped_kk

链接：https://www.jianshu.com/p/71f2e94c3334

来源：简书

著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

在手机上看监控有多种方式，至于用哪种方式，与监控系统的厂家有关。

1、安装一个厂家提供的APP，在APP里登录账号，山州握查逗庆看监控。

2、打开手机浏览器，打开厂家给的网址，输入账号和密码，查看监控。

3、有些厂家可能支持公众号和小程序查看监控。

4、在同一局域网迹段内，可能不需要输入账号密码，只需在浏览器中输入正确的网络地址。

---