微信小程序记录用户行为浏览记录和停留时间以及小程序全局分享
项目需求
1、后台统计一个用户在我们小程序的每个页面的停留时间
2,前台用户可以在个人中心看到自己的分享记录以及多少人查看
需求分析
需求一:想要记录用户在每个页面的停留时间,无非就是记录用户进来的时间和退出页面的时间,获取时间差。
需求二:每个页面在分享的时候做记录(附带用户的唯一标识openid或者其他跟后端对接)我的分享例
相信大家在看到这个需求之后都会有这样的思路,但是如果在每一个页面都这样操作重复代码太多,后期维护也过于麻烦,因此如果可以做一个全局函数,就可以避免这些问题,下面就是我的代码和具体操作,代码有不足欢迎指正优化,如果有更好的方法我们可以互相share学习一下(▽)。
在app.js中
添加一个重写分享的方法(记录用户行为的操作也放在里面了,代码里面有注释),在onLaunch中调用
//重写分享方法
overShare: function () {
var that = this
//监听路由切换
//间接实现全局设置分享内容
wx.onAppRoute(function (res) {
//获取加载的页面
let pages = getCurrentPages(),
//获取当前页面的对象
view = pages[pages.length - 1],
data;
data = view.data;
data.timeStart = Date.now() //在当前页面的data中,记录进入页面的时间
if(!data.addonHide) {
var oldOnHide = view.onHide // 记录单独在某些页面onhide里做的一些操作,防止全局覆盖原有页面操作
data.addonHide = true
view['onHide'] = function(view) { //全局添加的一些操作
// 做一些我们自己想做的事情
let timeEnd = Date.now() // 记录onhide时候的时间戳(用户离开页面的操作有两种(跳转页面走的是onhide,直接关闭小程序走的是onUnload )下面onUnload 不做解释,同样的操作)
var stayTime = timeEnd - data.timeStart // 获取停留时间
var stayArray = wx.getStorageSync('record') || [] // 这里我获取到当前页面的停留时间之后没有直接调用接口上报,而是先存起来(10条后上报,特殊情况除外(不够十条,用户关闭了小程序)),防止多次提交
stayArray.push({ //具体数据和相关参数跟后端对接
userId: wx.getStorageSync('tokenAdmin').frontUserId,
openId: wx.getStorageSync('tokenAdmin').openId,
type: data.shareType || '',
sourceId: data.id || '', // 资源id,(对于需要id的详情页)
page: res.path,
stay: stayTime,
timeStart: data.timeStart,
timeEnd: timeEnd
})
wx.setStorageSync('record', stayArray)
if(wx.getStorageSync('record').length == that.globalData.recordNumber) { // that.globalData.recordNumber即你规定的条数(多少条后上报)
that.setRecordBatch() // 调用上报的函数(根据自己接口编写,这里不展示)
}
// 调用原来的onHide方法
oldOnHide.call(that, res)
}
var oldOnUnload = view.onUnload
view['onUnload'] = function(view) {
// 做一些我们自己想做的事情
let timeEnd = Date.now()
var stayTime = timeEnd - data.timeStart
var stayArray = wx.getStorageSync('record') || []
stayArray.push({
userId: wx.getStorageSync('tokenAdmin').frontUserId,
openId: wx.getStorageSync('tokenAdmin').openId,
type: data.shareType || '',
sourceId: data.id || '',
page: res.path,
stay: stayTime
})
wx.setStorageSync('record', stayArray)
if(wx.getStorageSync('record').length == that.globalData.recordNumber) {
that.setRecordBatch()
}
// 调用原来的onUnload 方法
oldOnUnload.call(that, res)
}
}
//到此处 记录用户轨迹的操作结束,下面是针对全局分享的操作 (下面注释的这部分代码:统计用户是通过哪种方式查看的小程序,用户用户个人中心我的分享展示,如图一)
// var scene = '?' + decodeURIComponent(res.query.scene)
// var rid = getUrlParams(scene, 'rid') || ''
// if (view) {
// if(res.query.openid) {
// that.setClickRecord(res)
// }
// if(wx.getStorageSync('tokenAdmin')) {
// if(rid) {
// that.setPosterRecord(rid)
// }
// }
// console.log('是否重写分享方法', data.isOverShare)
if (data.isOverShare) { // isOverShare参数为是否需要需要重写分享方法,在需要的页面加上该变量
view.onShareAppMessage = function () {
if(wx.getStorageSync('tokenAdmin')) { //防止用户在该页面多次分享给不同的人记录成条分享记录,看需求
if(!data.isShareRecord) {
that.getshareRecord(res, data)
}
}
if(data.id) { //带id的页面分享参数和不带区分()
// console.log(data)
return {
title: data.shareTitle,
imageUrl: data.shareImage,
path: `${view.route}?id=${data.id}&openid=${wx.getStorageSync('tokenAdmin').openId}&ts=${Date.parse(new Date())}`,
}
} else {
return {
title: data.shareTitle,
path: `${view.route}?openid=${wx.getStorageSync('tokenAdmin').openId}&ts=${Date.parse(new Date())}`,
imageUrl: data.shareImage
}
}
}
}
}
})
},
个人中心我的分享
都看到这儿了,如果帮到了你,留下你的小心心吧~~ (^-^)V