版权声明:本文为CSDN博主「钟文辉」的原创文章,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/qq_39753974/article/details/80322643

在单页面中,要是只加在head中的话那是没用的,因为只能运行一次。

在百度中复制代码

将代码放在index.html的head中

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

  

在路由的beforeEach函数中使用

// router.js
let router= new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '*',
name: 'error_404',
component: error_404
}
]
}); router.beforeEach((to, from, next) => {
if (to.path) {
_hmt.push(['_trackPageview', '/#' + to.fullPath]);
}
next();
}

  

检测是否安装成功

打开控制台查看网络请求 
每次路由变化就会发出一个叫hm.gif的请求

两个小时候再进网页就会有统计数据

vue单页面应用加入百度统计的更多相关文章

  1. vue单页应用添加百度统计

    前言 申请百度统计后,会得到一段JS代码,需要插入到每个网页中去,在Vue.js项目首先想到的可能就是,把统计代码插入到index.html入口文件中,这样就全局插入,每个页面就都有了;这样做就涉及到 ...

  2. 【前端vue开发】vue单页应用添加百度统计

    前言 申请百度统计后,会得到一段JS代码,需要插入到每个网页中去,在Vue.js项目首先想到的可能就是,把统计代码插入到index.html入口文件中,这样就全局插入,每个页面就都有了;这样做就涉及到 ...

  3. AngularJs(SPA)单页面SEO以及百度统计应用(上)

    只有两种人最具有吸引力,一种是无所不知的人,一种是一无所知的人 问:学生问追一个女孩总是追不上怎么办?回答:女孩不是追来的,是吸引来的,你追的过程是吸引女孩的过程,如果女孩没有看上你,再追都是没有用的 ...

  4. AngularJs(SPA)单页面SEO以及百度统计应用(下)

    苍苍之天不得久视,堂堂之地不得久履 当你小心翼翼的开启服务端渲染的同时,一个问题不得不注意,使用内存模式去保存渲染过的页面,这样服务断掉重启后,缓存也没有了,所以这里我们使用mongdodb进行本地化 ...

  5. vue单页面打包文件大?首次加载慢?按需加载?是你打开方式不对

    部署各vue项目,走了一遍坑.... vue单页面应用刷新404 找到nginx多网站配置文件:类似nginx/sites-available/www.baidu.com server { liste ...

  6. 在不使用ssr的情况下解决Vue单页面SEO问题

    遇到的问题: 近来在写个人博客的时候遇到了大家可能都会遇到的问题 Vue单页面在SEO时显得很无力,尤其是百度不会抓取动态脚本 Vue-Router配合前后端分离无法让meta标签在蜘蛛抓取时动态填充 ...

  7. 处理 Vue 单页面应用 SEO 的另一种思路

    vue-meta-info 官方地址: monkeyWangs/vue-meta-info (设置vue 单页面meta info信息,如果需要单页面SEO,可以和 prerender-spa-plu ...

  8. Vue单页面骨架屏实践

    github 地址: VV-UI/VV-UI 演示地址: vv-ui 文档地址:skeleton 关于骨架屏介绍 骨架屏的作用主要是在网络请求较慢时,提供基础占位,当数据加载完成,恢复数据展示.这样给 ...

  9. [one day one question] Vue单页面应用如何保证F5强刷不清空数据

    问题描述: Vue单页面用按F5强刷,数据就恢复初始了,这怎么破? 解决方案: store.subscribe((mutation, state) => { sessionStorage.set ...

随机推荐

  1. 解决Wireshark安装Npcap组件失败

    解决Wireshark安装Npcap组件失败   从Wireshark 3.0开始,Npcap取代Winpcap组件,成为Wireshark默认的网卡核心驱动.由于该组件属于驱动程序,所以安装时候容易 ...

  2. python初级 1 内存和变量

    一.回顾: 1.什么是程序 一堆指令的集合 2.回想一下猜数游戏程序的特征: 1)需要输入(input) 2)会处理输入(process) 3)产生输出(output) 二.程序的一般特征:输入.处理 ...

  3. word封面背景及水印背景

    word封面背景及水印背景 觉得有用的话,欢迎一起讨论相互学习~Follow Me 制作封面 在制作商业项目申报书的时候我们想要封面尽可能美观,常用的方法是使用插入一张很大的图片作为背景. 标题等文本 ...

  4. ios开发注意事项小总结

    一.LaunchScreen LaunchScreen产生原因:代替之前的启动图片 好处: 1.可以展示更多的东西 2.可以只需要出一个尺寸的图片. 启动图片的优先级 启动图片 < Launch ...

  5. dubbo+zookeeper+springboot简单示例

    目录 dubbo+zookeeper+springboot简单示例 zookeeper安装使用 api子模块 生产者producer 消费者consumer @(目录) dubbo+zookeeper ...

  6. 【JQuery Zepto插件】图片预加载

    屏幕滚动到图片当前位置加载图片,把图片的真实地址写到data-src属性里即可. <img src="占位图" data-src="img/foot.jpg&quo ...

  7. CSS控制元素背景透明度总结

    方法一:CSS3的background rgba filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColor ...

  8. centos7.6 升级openssh openssl

    centos7.3和centos7.6升级完毕测试登录ssh以及重启后登录ssh均无问题. 前期请自行配置好yum源(如果不会请百度) 整个过程不需要卸载原先的openssl包和openssh的rpm ...

  9. 个人博客搭建全记录(Hexo,Github)

    搭建过程主要借鉴小歪的博客 博客主题airclod Hexo,Github建站记录 1. 准备 Github账号 注册登陆Github 创建Repository,Repository Name就是Yo ...

  10. 微信小程序中的事件绑定

    前言: 微信小程序中的事件绑定和Vue中的事件绑定其实有很多的相似之处,所以如果有过Vue相关的经验,学起来的话还是比较容易的. js代码: // 页面级的js文件必须调用Page函数来注册页面, / ...