我终于进来大厂，成为了美团下面的一名光荣骑手
新的需求下来，关键字“百度统计”
下面是百度统计的官网链接：https://tongji.baidu.com/web/welcome/login
百度统计有什么用
下面一段copy
copy:begin
百度统计:是百度推出的一款专业网站流量分析工具，能够告诉您访客是如何找到并浏览您的网站，以及如何改善访客在您网站上的使用体验，帮助您让更多的访客成为客户，不断提升网站的投资回报率。
百度统计:提供了几十种图形化报告，全程跟踪访客的行为路径，并且帮助监控各种[网络媒介]推广效果，让您及时了解哪些关键词、哪些创意的效果最好。同时，百度统计集成[百度推广]数据，帮助您及时了解[百度推广]效果并优化推广方案。
基于百度强大的技术实力，百度统计提供了丰富的数据指标，系统稳定，功能强大但操作简易。登陆系统后按照系统说明完成代码添加，百度统计便可马上收集数据，为您提高投资回报率提供决策依据。
copy:end
第一步注册账户
得到他们给你的token
第二部在html中加入这个代码
var _hmt = _hmt || [];
window._hmt = _hmt;
(function () {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?你的token";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
这段代码其实就是在你的html中加入script标签
百度统计原理
知乎大神文章推荐查看
https://zhuanlan.zhihu.com/p/35844509
简单概括就是
每次运行上面js代码,就会发起请求，传递数据到百度的统计系统，然后百度统计数据
效果如下：
传递的参数
也就是如果你对界面请求了这个，就说明使用成功了
问题，如果我用的是前端路由 history hash模式？
也就是百度提供的代码只在html第一次加载的时候运行一次而已，这就尴尬了
于是百度官网提供的方案是：
https://tongji.baidu.com/open/api/more?p=guide_trackPageview
在每次前端hostory.push的时候，调用下面的方法
window._hmt.push(['_trackPageview', pageURL]);
你唯一要解决的问题是监听router的改变
我用的是react
使用过的方法如下
this.props.history.listen((location, action) => {
// location is an object like window.location
// console.log(action, location.pathname, location.state)
// debugger
window._hmt.push(['_trackPageview', location.pathname]);
});
ok,点击切换界面，查看
网站请求hm.gif，完美
end
