vue中引入百度统计
vue作为单页面的,引入百度统计,需要注意不少。
一、基本的流量统计
在index.html 入口文件中引入百度统计生成的一连串代码:
var _hmt = _hmt || []; (function() { var hm = document.createElement('script'); hm.src = 'https://hm.baidu.com/hm.js?f62fe3c5d9343dece386407e99be4e39'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(hm, s); })();
这个会统计页面总的流量。
二、页面中监听事件
需要在相应的vue 文件中加入相应的代码
methods: { getDownIosUrl() { window._hmt.push(['_trackEvent', 'IosDoctor', 'click', '来康医生IOS版', 'opt_value']); window.location.href = 'itms-apps://itunes.apple.com/cn/app/id1233649213?mt=8'; }, }
PS:必须要写window._hmt.push 否则会监听不到
三、单个页面流量的检测
在路由的配置文件中,加入这行代码。
// 测试百度统计 routeInstance.beforeEach((to, from, next) => { if (to.path) { window._hmt.push(['_trackPageview', '/pro/#' + to.fullPath]); } next(); })
'/pro/#' 写相对路径,解决vue 路由 hash 模式下,百度统计无法统计单页面的问题。
四、广告途径的追踪
可以根据转化率来确定下载次数。在转化设置中,设置事件转化中的trackevent。
然后通过“报告中的入口页面中的转化分析”查看数据。