统计有多少人访问了自己的网站(wap端pc web端都适用),或者更细的统计网站每个页面的访问量,可以使用百度统计

百度统计传送门

按提示注册登录即可

登录后-->管理-->新增网站,配置好后会出现如下的 自有网站列表

在要统计的网站 右侧,点击“获取代码”

拷贝要统计网站的代码

统计vue项目中的每个页面的访问量

1.在main.js中 贴入 拷贝的代码 并稍作修改,使用window全局变量,如下:

var _hmt = _hmt || [];
window._hmt = _hmt; // 修改为window 全局变量
(function () {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?"+ 百度站点id;
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();

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

2.在路由创建实例后,调用beforeEach方法,保证每个路由跳转时都将其跳转的路由推给百度。

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import Main from '../pages/Main.vue' Vue.use(Router)
const routes = [
{
path: '/hellowold',
name: 'HelloWorld',
component: HelloWorld
},
{
path: '/main',
name: 'Main',
component: Main
}
] // export default new Router({
// // mode: 'history',
// routes: routes
// }) const router = new Router({
routes: routes
}) router.beforeEach((to, from, next) => {
if (window._hmt) {
if (to.path) {
window._hmt.push(['_trackPageview', '/#' + to.fullPath])
}
}
next()
}) export default router

https://www.jianshu.com/p/febd38110645

单页面vue引入百度统计 https://www.cnblogs.com/zengfp/p/9778119.html

vue项目中使用百度统计的更多相关文章

  1. 如何在vue项目中使用百度编辑器ueditor

    百度编辑器官方并没有提供vue项目使用说明,目前网上也有不少人实现了相关功能,这里就不再重复,只是针对自身项目碰到的情况做个记录,就当是熟悉了一遍富文本编辑器的代码结构. 按照网上的做法,基本可以实现 ...

  2. vue项目中添加百度地图功能及解决遇到的问题详解

    第一步,在百度地图开放平台 申请密钥 (如果有密钥可以省略此步骤,朋友有也可以借) 地址:http://lbsyun.baidu.com/ 第二步,创建应用并填写表单(下面链接可参考) http:// ...

  3. vue项目中使用百度富文本编辑器ueditor

    第一步,安装依赖,并且把ueditor整个文件夹放入public里边 第二步,在你需要编辑的地方引入,或者main.js中全局引入 XX.vue文件中写入下面代码,创建编辑器. <vue-ued ...

  4. vue项目中使用百度地图的方法

    1.在百度地图申请密钥: http://lbsyun.baidu.com/  将 <script type="text/javascript" src="http: ...

  5. vue 项目中引用百度地图

    新建map.js export const BaiduMap = { init: function() { const BMapURL = 'https://api.map.baidu.com/api ...

  6. 在vue项目中获取当前城市

    在vue项目中使用百度地图获取当前城市:https://www.jianshu.com/p/0819cfd46712 Vue2 :百度地图bmap:https://www.jianshu.com/p/ ...

  7. vue中引入百度统计

    vue作为单页面的,引入百度统计,需要注意不少. 一.基本的流量统计 在index.html 入口文件中引入百度统计生成的一连串代码: var _hmt = _hmt || []; (function ...

  8. vue项目中遇到的那些事。

    前言 有好几天没更新文章了.这段实际忙着做了一个vue的项目,从 19 天前开始,到今天刚好 20 天,独立完成. 做vue项目做这个项目一方面能为工作做一些准备,一方面也精进一下技术. 技术栈:vu ...

  9. 在vue项目中使用UEditor--plus

    1:UEditor-plus富文本编辑器如何在vue项目中使用 备注:UEditor是由百度web前端研发部开发的所见即所得的开源富文本编辑器,由于该项目不在维护:程序员自发对其进行了维护,详见 ht ...

随机推荐

  1. 16.Linux yum扩展

    1.列出yum源可用的软件仓库 [root@yinwucheng ~]# yum repolist [root@yinwucheng ~]# yum repolist all 查看所有的仓库  ``` ...

  2. 零基础教程!一文教你使用Rancher 2.3和Terraform运行Windows容器

    本文来自Rancher Labs 介 绍 在Kubernetes 1.14版本中已经GA了对Windows的支持.这一结果凝结了一群优秀的工程师的努力,他们来自微软.Pivotal.VMware.红帽 ...

  3. 【Java】遍历List/Set/Map集合的一些常用方法

    /* * 遍历List/Set/Map集合的一些常用方法 */import java.util.ArrayList;import java.util.HashMap;import java.util. ...

  4. printf 格式输出代码大全

    d,lx,ld,,lu,这几个都是输出32位的hd,hx,hu,这几个都是输出16位数据的,hhd,hhx,hhu,这几个都是输出8位的,lld,ll,llu,llx,这几个都是输出64位的, pri ...

  5. Python 中的for....else....

    在一个for循环中,当循环遇到break语句之后程序就会跳出循环,执行for循环之后的语句:但是,当整个循环都没有遇上break语句,而且你想在这种情况下做一些事情的话,你就可以通过结合else来完成 ...

  6. UITabView

    UITabView可是实现列表功能,此文转自https://www.cnblogs.com/longiang7510/p/5367080.html,讲述很详细,都有注视,但是注释解释不太确切,可以自行 ...

  7. SpringBoot系列之YAML配置用法

    1.全局配置 SpringBoot的全局配置文件有两种: application.properties application.yml 配置文件的作用:修改SpringBoot自动配置的默认值,主要是 ...

  8. Java12 Collectors.teeing 你需要了解一下

    前言 在 Java 12 里面有个非常好用但在官方 JEP 没有公布的功能,因为它只是 Collector 中的一个小改动,它的作用是 merge 两个 collector 的结果,这句话显得很抽象, ...

  9. 一次flume exec source采集日志到kafka因为单条日志数据非常大同步失败的踩坑带来的思考

    本次遇到的问题描述,日志采集同步时,当单条日志(日志文件中一行日志)超过2M大小,数据无法采集同步到kafka,分析后,共踩到如下几个坑.1.flume采集时,通过shell+EXEC(tail -F ...

  10. 千与千寻主题曲beep函数版

    在出代码之前,我们向来了解一下Beep函数. 例: Beep(,); 这个表示575Hz响100ms. 下面给出代码: #include <bits/stdc++.h> #include ...