网站统计工具的大致流程

在我们所负责的业务运转正常，具备所有功能的网站上线后，较好的习惯是着手开始准备收集与分析数据。能够在设计产品的功能过程中，考虑是否带有数据意识进行优化，其实就从基础的做产品、画原型进阶到了更进一步分析产品的阶段。

对于大多数的网站分析需求来说，常用的工具主要有百度站长分析、谷歌统计和友盟分析、GrowingIO等。其实所有这些统计分析工具的实现方式都比较近似，第一步对网站访问数据进行收集，第二步对网站数据进行统计，第三步对所收集到的数据进行可视化展示。

近几年像GrowingIO等产品推出的“圈选无埋点”亮点，也仅是指不再需要用户来定义行为采集的触发条件和后续行为，而是通过后端配置或前端可视化圈选等方式来完成关键事件的定义和捕获，从而提升埋点工作的效率和易用性。

在这样的场景下，数据监测工具一般倾向于在监测时捕获和发送尽可能多的事件和信息，而在数据处理后端进行触发条件匹配和统计计算等工作，以较好地支持关注点变更和历史数据回溯。

早期的网站统计工具往往只能收集页面打开的相关数据，这种收集策略只能满足最基本的流量分析、来源分析、内容分析、客户设备等属性分析等常用分析需求，但随着ajax技术的使用越来越广泛，以及及电子商务网站对于电子商务目标的统计分析的需求越来越强烈，于是统计工具又可以根据用户的实际需求，对用户自定义的指标进行分析与跟踪。目前主流的数据收集方式基本都是基于javascript的，今天我们来尝试分析下百度站长分析工具的基本原理。

大体来说，百度站长分析工具的流程是这样的：

因为用户的行为而对页面发出访问请求；
页面中预置的JavaScript代码被执行并创建js的数据收集脚本；
数据收集；
收集完毕后js脚本请求后端的数据收集脚本；
脚本传递到后端；
后端讲脚本内容按照对应的参数记录至系统中；

具体是怎么实现的呢

第一步：加载代码

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

一般而言，只要我们在申请了百度站长统计的服务之后，都会被要求在当前的网页中加入这样一段JavaScript代码，这段代码的意义就是去创建一个script标签，并将src指向一个单独的js文件（即https://hm.baidu.com/hm.js?2b02c5f5ee6001db4a829a61f90fb2c5这个文件）

第二步：写入Cookie

在获取到了hm.js代码的同时，百度站长统计会往浏览器中写入一个名字为“HMACCOUNT”的Cookie，这个Cookie的过期时间为2038年，所以只要你没有清空浏览器cookie，基本就永不过期，这个Cookie文件主要会被用来追踪你的行为，同时为结合其他使用了百度站长统计服务的站点来描绘你的用户画像。