还在等工程师排期?这篇代码自查攻略送给你

文丨兰茹 触脉咨询数据工程师

当我们在拉取GA报告或做数据分析时,偶尔会发现一些奇怪的数据表现,可能会初步猜测是否跟踪代码触发不正常,或者代码正常触发但传值有误。

想找出准确原因就需要工程师进行代码检查,但往往得到的回复是:

排期太满,尽力而为

这确实是个不好解决的矛盾。

那有没有办法自己来完成一些简单的代码检查工作呢?答案是肯定的!

首先,我们可以根据站点应用类型来选择不同的检查方式。站点应用类型一般分为:Web应用、Android应用、IOS应用、微信小程序应用。

Web应用:

如果是Web应用,GA代码检查相对来说比较简单,通常推荐以下两种检查方式:

方式一:使用Chrome浏览器插件。

GA官方推荐是使用Google Analytics Debug插件,其实还有一款插件:Adswerve – dataLayer Inspector+,该插件界面更简洁,可以更直观的查看GA代码类型、媒体资源id、事件参数等重要字段,使用方法与Google Analytics Debug类似。

操作步骤如下:

第一步:在Chrome商店中搜索Adswerve-dataLayer Inspector+插件并下载安装

第二步:启用该插件

第三步:在浏览器中打开部署了GA代码的页面

第四步:启动开发者工具(右击检查、F12、更多工具->开发者工具)

第五步:点击开发者工具的控制台选项(Console)

在控制台中就可以看到相应的部署信息,如下图:

Tips:这种方式只适用于代码正常触发,如果代码有报错等未正常触发的情况时,控制台中将不会有相应信息。

方式二:直接在Chrome浏览器开发者工具中查看。

此方式可以查看不同类型代码触发是否正常以及传值是否正确,只是需要我们找到对应类型的代码,并找到这条代码请求的Query String Parameters。

相比方式一,没有那么直观,但可以作为方式一的补充方式。具体操作如下:

第一步:启动开发者工具(右击审查元素,F12,工具->开发者工具)

第二步:点击开发者工具的网络选项(Network)

第三步:在Network过滤器输入请求关键字collect

第四步:collect文件返回状态码为200表示正常触发

第五步:点击collect文件,找到Query String Parameters,进一步检查重要字段,查看数据是否准确发送。

手机端应用:

如果是手机端的应用,包括:Android应用、IOS应用、小程序应用,我们推荐使用抓包工具Charles。具体操作如下:

第一步:在电脑端下载安装Charles工具,官网地址:

https://www.charlesproxy.com/documentation/using-charles/

第二步:安装好电脑端和手机端的信任证书

第三歩:将手机端的网络设置为http代理

具体配置和调试方式可以参考链接:https://www.cnblogs.com/shoshana-kong/p/11134852.html

调试成功后,使用Android、IOS应用设备访问已经部署过GA代码的APP应用或小程序应用,就可以在Charles界面中查看GA请求了。

有一点需要注意:Android设备从7.0开始系统不再信任用户CA证书,也就是说即使安装了用户CA证书,在Android7.0+的机器上,HTTPS包也是抓不到的。除非在您的APP应用代码中加上信任用户CA证书的处理,这需要开发人员的配合。IOS设备不受影响。

APP应用的查看方式:

在Charles界面Filter中输入“google”,就能过滤出APP应用发送给GA的请求,然后点击具体的batch,可以查看具体的传值情况,如下图:

微信小程序应用的查看方式:

由于微信小程序的GA监测代码一般是以测量协议的方式实现的。而微信小程序要想向GA服务器发送数据请求,只能通过第三方服务器转发的形式,那我们使用Charles抓包时也只能抓取到小程序前端到第三方服务器的请求。

所以要想查看小程序的请求数据及参数,先要拿到小程序前端请求第三方服务器的请求地址,然后在Charles的Filter中过滤出该请求地址的请求,点击具体请求就能查看请求参数了。

如下图:

提示:当我们查看具体参数传值时,所看到的参数名都是一些类似于缩写的字母,那这些参数名具体是什么意思,代表的是哪一个traking参数呢?

其实以上无论是哪种应用下的GA代码(analytics.js、Android GA SDK、IOS GA SDK、测量协议),最终发送给GA服务器都是以测量协议的方式。

所以看到的这些参数都是测量协议的参数类型,可以参考测量协议的参数说明文档查看具体参数定义:

https://developers.google.com/analytics/devguides/collection/protocol/v1/parameters

以上就是几种简单的检查GA代码的方式,当工程师朋友们无法提供查代码的支持时,不妨我们自己动手试一试。

发表评论

邮箱地址不会被公开。 必填项已用*标注