vue使用百度统计

1、添加自有网站

2、代码获取

3、在项目中添加代码

方法一：在index.html处插入对应的script片段

    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?xxxxxxxxxxxxxxxxxxx";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>

注意：

1. 请将代码添加到网站全部页面的</head>标签前。

2. 建议在header.htm类似的页头模板页面中安装，以达到一处安装，全站皆有的效果。

3. 如需在JS文件中调用统计分析代码，请直接去掉以下代码首尾的，<script type="text/javascript">与</script>后，放入JS文件中即可。

如果代码安装正确，一般20分钟后，可以查看网站分析数据。

方法二：在main.js加入代码

var _hmt = _hmt || [];
window._hmt = _hmt;
(function() {
    var hm = document.createElement("script");
    hm.src = "https://hm.baidu.com/hm.js?xxxxxxxxxxxxx";
    var s = document.getElementsByTagName("script")[0];
    console.log(s)
    s.parentNode.insertBefore(hm, s);
})();

注意：不使用window全局变量，_hmt会找不到然后报错，这是因为在一个js文件里声明的变量在另一个js文件里是找不到的，所以需要把_hmt挂载到window对象下,这样_hmt成为了全局变量，就可以在任何地方访问了

然后在路由文件中下， router.beforeEach中添加代码，保证每个路由跳转时都将其跳转的路由推给百度

router.beforeEach((to, from, next) => {
    if (window._hmt) {
        if (to.path) {
            window._hmt.push(['_trackPageview', '/#' + to.fullPath])
        }
    }
    next()
});

4、检查代码是否正常安装

谷歌浏览器进入安装代码的网页，按F12打开控制台，进入Network页面，如下图所示，能看到hm.js文件就说明已成功安装

其它：

1、对应用下载进行统计（页面按钮点击次数统计）

2、在nuxt项目中使用百度统计，在nuxt.config.js文件中，添加如下代码，再去网页检查安装成功即可

猜你喜欢