微信小程式記錄使用者行為瀏覽記錄和停留時間以及小程式全域性分享
專案需求
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
              }
            }
          }
        }
      }
    })
  },

原文連結：https://blog.csdn.net/weixin_42311676/article/details/113308618

搜尋

複製