结合最近的埋点需求以及文档查阅总结一些埋点知识
所谓埋点就是在应用中特定的流程收集一些信息，用来跟踪应用使用的状况，后续用来进一步优化产品或是提供运营的数据支撑，包括访问数（Visits），访客数（Visitor），停留时长（Time On Site），页面浏览数（Page Views）和跳出率（Bounce Rate）。这样的信息收集可以大致分为两种：页面统计（track this virtual page view），统计操作行为（track this button by an event）。
现在埋点的主流有两种方式：
- 第一种：自己公司研发在产品中注入代码统计，并搭建起相应的后台查询。
- 第二种：第三方统计工具，如友盟、神策、Talkingdata、GrowingIO等。
如果是产品早期，通常会使用第二种方式来采集数据，并直接使用第三方分析工具进行基本的分析。而对于那些对数据安全比较重视，业务又相对复杂的公司则通常是使用第一种方式采集数据，并搭建相应的数据产品实现其数据应用或是分析的诉求。
由于目前我们公司数据量不算很大，运营对数据的要求也没那么高，这次就白嫖了友盟的埋点sdk，使用方法如下：
- 在
head标签里注入安装代码
<script type="text/javascript">
document.write(unescape("%3Cspan id='cnzz_stat_icon_1280118174'%3E%3C/span%3E%3Cscript src='https://v1.cnzz.com/z_stat.php%3Fid%3D1280118174' type='text/javascript'%3E%3C/script%3E"));
</script>
这样就算部署成功了，但是，你会发现，站长之家的样式有点丑。
站长之家：要么是文本要么是logo，总之你用了我，你就得体现我的存在
我：我可以做渣男吗？
可以，只要加一个 display:none 就行了
<script type="text/javascript">
document.write(unescape("%3Cspan style='display:none;' id='cnzz_stat_icon_1280118174'%3E%3C/span%3E%3Cscript src='https://v1.cnzz.com/z_stat.php%3Fid%3D1280118174' type='text/javascript'%3E%3C/script%3E"));
</script>
这样基础功能就有了，可以看到概况
进一步，怎么做事件埋点呢，对，这才是我想要的啊
很简单，监听点击事件，调用 _trackEvent 方法即可
- 在
head标签刚刚注入的代码下加上
<script>
let _czc = window._czc || [];
_czc.push(["_setAccount", "1280118174"]);
</script>
声明 _czc ，绑定账户id
- 在需要调用的页面直接用
_trackEvent方法
let _czc = window._czc
return (
<Link to='/bdInvitation' className={styles.box_item} style={{marginRight:'0'}}>
<img className={styles.item_img} src={xxx} alt='' onClick={()=>{_czc.push(['_trackEvent','邀请BD','点击','BD名称',userId])}}/>
<div className={styles.item_title}>邀请BD</div>
</Link>
)
下面讲一下 _czc.push(['_trackEvent','小说','打分','达芬奇密码','5'])
第一个参数 _trackEvent 是被调用的方法
第二个参数 小说 是事件类别，必填项，string 类型
第三个参数 打分 是事件操作，必填项，string 类型
第四个参数 达芬奇密码是事件标签，选填项，string 类型
第五个参数 5是事件值，选填项，int 类型
这样就能看到事件统计啦
给个文档传送门：developer.umeng.com/docs/67963/…
