vue项目在微信公众号网页里，监听页面埋点（包括关闭项目前发送请求记录）

问题难点：主要是关闭项目监听问题，这里用到的是visibilitychange（尝试过onunload，onbeforeunload，pagehide，均没有解决问题）

App.vue文件里：

mounted: function () {
    // 添加监听事件
    document.addEventListener('visibilitychange', e => this.visibilitychangeHandler(e))
    sessionStorage.setItem('setFirstInto', true)
    this.$router.onReady(() => {
        sessionStorage.setItem('setFirstIntoPath', this.$route.path)
    })
},
methods: {
            visibilitychangeHandler (e) {
                if (document.visibilityState !== 'visible') {
                    sessionStorage.setItem('setFirstInto', false)
                    if (this.$route.meta.id) {
                        let stayTime = this.$utils.timeFn(this.$route.meta.intoTime)
                        editStayTime(this.$route, stayTime, () => {
                            this.$route.meta.id = null
                        })
                    }
                } else {
                    sessionStorage.setItem('setFirstInto', true)
                    if (!this.$route.meta.id) {
                        insertPoint({
                            to: this.$route,
                            type: 0
                        }, res => {
                            this.$route.meta.id = res.data.data
                            this.$route.meta.intoTime = new Date()
                        })
                    }
                }
                // todo   在页面刷新或关闭之前需要处理得操作，例如清除或保存数据
            }
        },
destroyed () {
    document.removeEventListener('visibilitychange', e => this.visibilitychangeHandler(e))
},

router/index.js文件里：

// 具体路由配置里，需要记录埋点的路由加上systemSource字段
{
    path: '/ceshi',
    name: 'ceshi',
    component: (resolve) => require(['@/views/ceshi'], resolve),
    meta: {
        systemSource: 4 // 埋点系统来源id
    }
}




router.beforeEach((to, from, next) => {
    if (from.meta.id) {
        let stayTime = utils.timeFn(from.meta.intoTime)
        editStayTime(from, stayTime, () => {
            from.meta.id = null
        })
    }

    let timeOut = setTimeout(() => {
        if (to.meta.systemSource && (to.meta.id === null || isNaN(to.meta.id))) {
            let isFirstInto = JSON.parse(sessionStorage.getItem('setFirstInto'))
            let firstIntoPath = sessionStorage.getItem('setFirstIntoPath') // 在ios手机上关闭项目时，每次都触发一次刚进项目的路由跳转（不知道是不是因为后端授权的原因），此处代码为了处理iOS这个问题
            if ((to.path === firstIntoPath && isFirstInto) || to.path !== firstIntoPath) {
                insertPoint({
                    to: to,
                        type: 0
                    }, res => {
                        to.meta.id = res.data.data
                        to.meta.intoTime = new Date()
                    })
                    clearTimeout(timeOut)
                }
            }
    }, 100)
    next()
})

经测试，在安卓和ios手机上均可正确记录埋点