用户停留时长监控

main.js

@@ -5,7 +5,9 @@ import './services/index.js'
 import * as Api from '@/common/config/caimeiApi.js'
 import * as Regs from '@/common/config/common.js'
 import cmSysMixins from '@/mixins/cmSysMixins.js'
-import './utils/router.js'
+// import './utils/router.js'
+import ResidenceTime from './plugins/simple-residence-time'
+import residence from './utils/residence.js'
 
 // 友盟
 import Uma from './plugins/uma'
@@ -47,6 +49,7 @@ App.mpType = 'app'
 
 // 使用插件
 Vue.use(Uma)
+Vue.use(ResidenceTime, residence)
 
 
 const app = new Vue({

plugins/simple-residence-time/index.js

@@ -0,0 +1,56 @@
+import { getCurrentRoute, showLog } from './utils.js'
+
+// 用于存放页面相关信息
+const map = new Map()
+
+/* 保存页面进入时的时间及其它参数信息 */
+function addTime() {
+    const route = getCurrentRoute()
+    if (!route || map.has(route.path)) return
+    const currentTime = Date.now()
+    const data = { time: currentTime, ...route }
+    map.set(route.path, data)
+    return data
+}
+
+/* 获取页面离开时的时间及其它参数信息 */
+function getTime() {
+    const route = getCurrentRoute()
+    if (!map.has(route.path)) return
+    const data = map.get(route.path)
+    map.delete(route.path)
+    return data
+}
+
+export default function(Vue, options = {}) {
+    Vue.mixin({
+        onLoad() {
+            const res = addTime()
+            if (!res) return
+            if (typeof options.onEnter === 'function') {
+                options.onEnter(res, map, showLog)
+            }
+        },
+        onShow() {
+            const res = addTime()
+            if (!res) return
+            if (typeof options.onEnter === 'function') {
+                options.onEnter(res, map, showLog)
+            }
+        },
+        onHide() {
+            const res = getTime()
+            if (!res) return
+            if (typeof options.onLeave === 'function') {
+                options.onLeave(res, map, showLog)
+            }
+        },
+        beforeDestroy() {
+            const res = getTime()
+            if (!res) return
+            if (typeof options.onLeave === 'function') {
+                options.onLeave(res, map, showLog)
+            }
+        }
+    })
+}

plugins/simple-residence-time/utils.js

@@ -0,0 +1,17 @@
+/* 获取当前展示页面 */
+export function getCurrentRoute() {
+    const pages = getCurrentPages()
+    const page = pages[pages.length - 1]
+    if (!page) return
+    const route = { path: page.route, fullPath: page.$page?.fullPath, query: page.options }
+    return route
+}
+
+/* 方便打印日志 */
+export function showLog(...args) {
+    console.log('\n')
+    console.log('◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆')
+    console.log(...args)
+    console.log('◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆')
+    console.log('\n')
+}

utils/residence.js

@@ -0,0 +1,59 @@
+import { includeList } from './router.config.js' // 配置信息
+import ajaxService from '@/services/ajax.service.js'
+import UserService from '@/services/user.service'
+const UserApi = new UserService(ajaxService)
+
+// 校验是否为配置的路径
+const isInclude = (url) => {
+    if (!url) return false
+    return includeList.some(item => url.indexOf(item.url) > -1)
+}
+// 校验返回页面类型
+const isIncludeType = (url) => {
+    if (!url) return false
+    return includeList.find(item => url === item.url)
+}
+
+// 参数
+const userSync = uni.getStorageSync('userInfo')
+const defaultParams = {
+    pagePath: '', //页面路径
+    accessDuration: 0, //浏览时长初始值为 0
+    pageType: '', //页面类型
+    pageLabel: '', //页面标签
+    userId: userSync ? userSync.userId : 0, //用户Id
+    productId: 0 //商品Id
+}
+
+// 上送接口Api
+const userRecordStatistics = (params) => {
+    UserApi.userRecordStatistics(params)
+        .then(response => {
+            console.log('◆◇◆◇上送用户行为记录成功◇◆◇◆')
+        })
+        .catch(error => {
+            console.log('◇◆◇◆上送用户行为记录异常◇◆◇◆')
+            return
+        })
+}
+
+// 页面进入
+const onEnter = (route, map, log) => {
+    /* 需要什么东西就加载route里面 route.query可以获取到当前页面的参数 */
+    log('页面进入:', route.path, route.query, map)
+}
+
+// 页面离开
+const onLeave = (route, map, log) => {
+    console.log('\n')
+    console.log('◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆')
+    console.log('页面离开')
+    defaultParams.pageType = isIncludeType(route.path).pageType
+    defaultParams.accessDuration = Date.now() - route.time
+    defaultParams.pageLabel = uni.getStorageSync('pageLabel')
+    userRecordStatistics(defaultParams)
+    console.log('◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆')
+    console.log('\n')
+}
+
+export default { onEnter, onLeave }