欢迎光临
技术人生-雨巷前端

vue项目中添加cnzz统计

App.vue中添加如下代码

<script>
  export default {
    name: 'App',
    mounted() {
      // 创建cnzz统计js
      const script = document.createElement('script')
      script.src = `https://s4.cnzz.com/z_stat.php?id=${CNZZ_ID}&web_id=${CNZZ_ID}`
      script.language = 'JavaScript'
      document.body.appendChild(script)
    },
    watch: {
      '$route': {
        handler(to, from) {
          // 避免首次获取不到window._czc
          setTimeout(() => {
            if (window._czc) {
              const location = window.location
              const contentUrl = location.pathname + location.hash
              const refererUrl = '/'
              // 如果您使用_trackPageview改写了已有页面的URL,那么建议您在CNZZ的JS统计代码执行前先调用_setAutoPageview,将该页面的自动PV统计关闭,防止页面的流量被统计双倍。
              window._czc.push(['_setAutoPageview', false])
              // 用于发送某个URL的PV统计请求,
              window._czc.push(['_trackPageview', contentUrl, refererUrl])
            }
          }, 300)
        },
        // 首次进入页面即执行
        immediate: true
      }
    }
  }
</script>

注意替换“CNZZ_ID”字段,

然后打包部署,进入cnzz管理平台查看统计结果

未经允许不得转载:技术人生 » vue项目中添加cnzz统计

分享到:更多 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

我是前端,我不迷茫