巧用Img-JavaScript收集页面数据

摘要：当我们有一个新的内容（比如新的功能，新的活动，新的游戏，新的文章），作为运营者，我们都迫不及待的想要传达给用户尽快，因为这是获取用户的第一步，也是最重要的一步。点击此处查看原文：http://click.aliyun.com/m/40929/当我们发送重要邮件时，为了确认对方已阅读，我们会在邮件中设置一个“已读回执”标签电子邮件以确保对方阅读了这封信。该模型用途广泛，例如：发送传单时，确保对方已阅读宣传网页，有多少用户点击了移动App操作活动页面，分析用户访问。这种个性化的收集和统计针对的是站长CNZZ，百度统计，手机说数据，友盟等都是无能的。主要难点在于：个性化需求难以满足：用户产生的行为不是移动场景，其中会包含一些领域的个性化需求进行运营，如：来源、渠道、环境、行为等参数难以满足开发/成本高：要完成一个数据采集分析需求，首先需要购买云主机、公网IP，开发数据接收服务器、消息中间件等，通过相互备份保证服务的高可用；接下来，您需要开发和测试服务器。使用不易：数据到达服务端后，工程师需要对结果进行清洗，导入数据库。运营所需的数据无法弹性生成：无法预估用户的使用情况，需要预留一个庞大的资源池。从以上几点来看，当一个面向内容的运营需求来了之后，如何非常快速的满足这样的用户行为收集和分析需求，是一个很大的挑战。日志服务提供WebTracking/JS/TrackingPixelSDK解决以上轻量级埋点采集场景。我们可以在1分钟内完成埋点和数据上报。此外，日志服务提供每个账号*每月500MB的免费额度，让你不花钱也能办事。方案介绍这里介绍的采集+分析方案是基于阿里云日志服务的。该服务是日志数据的一站式服务。无需开发即可快速完成海量日志数据的采集、消费、传递、查询和分析，提高运维和运营效率。服务功能包括：LogHub：实时采集消费。连接Blink、Flink、SparkStreaming、Storm、Kepler。数据传递：LogShipper。MaxCompute、E-MapReduce、OSS、FunctionCompute开放查询和实时分析：LogSearch/Analytics。对接DataV、Grafana、Zipkin、Tableua等。采集端介绍，日志服务提供30+数据采集方式，提供服务器、移动端、嵌入式设备、多种开发语言的完整解决方案。典型的有：Logtail：专为X86服务器设计。Android/iOS：专为移动端设计SDKProducerLibrary：这里介绍的轻量级采集方案（WebTracking），适用于CPU/内存有限的智能设备。该方案只需要一次httpget请求就可以将数据传输到日志服务的Logstore中，适用于各种无需认证的应用。静态网页、广告、宣传材料、移动数据收集。与其他日志采集方案相比，其特点如下：WebTracking接入步骤WebTracking（也叫TrackingPixel）一词来源于HTML语法中的图像标签：我们可以在页面上嵌入一张0像素的图像，这是不可见的。用户默认在访问显示加载图片的页面时，会向服务器发起Get请求，此时会向服务器传递参数。WebTracking的使用步骤如下：打开Logstore的WebTracking标签（Logstore默认不允许匿名写入，使用前需要开启Logstore的WebTracking开关）通过埋入的方式向Logstore写入数据，有三种选择：直接通过HTTPGet方法上报数据curl--requestGET'http://${project}.${sls-host}/logstores/${logstore}/track?APIVersion=0.6.0&key1=val1&key2=val2'通过在Image标签下嵌入HTML，自动以页面方式上报数据或track_ua.gif服务器除了上传自定义参数外，还会将http头中的UserAgent和referer作为日志中的字段。通过JavaScriptSDK上报数据varlogger=newwindow.Tracker('${sls-host}','${project}','${logstore}');logger.push('customer','zhangsan');logger.push('product','iphone6s');logger.push('price',5500);记录器.记录器（）；案例：内容多渠道推广当我们有一个新的内容（比如新功能、新活动、新游戏、新文章），作为运营者，我们会迫不及待地第一时间传达给用户，因为这这是获取用户的第一步，也是最重要的一步。以游戏发行为例：市场在游戏推广上投入了大量资金。比如投放10000条广告，成功加载2000人，占比20%左右。其中800人点击并最终下载并注册账号试玩。从以上可以看出，能够准确、实时地获取内容推广的效果，对于商家来说是非常重要的。为达到整体推广目标，运营商往往选择多种渠道进行推广，如：用户站内信（Mail）、官网博客（Blog）、首页文案（Banner等）SMS、用户Email、传单等新浪微博、钉钉用户群、微信公众号、知乎论坛、今日头条等新媒体解决方案设计在我们的日志服务中创建一个Logstore（例如：myclick），对需要推广的文档开启WebTracking功能（article=1001)为每个宣传渠道添加标签，生成WebTracking标签（以img标签为例），如下：站内消息渠道（mailDec）：用户邮箱（email）：可以在from参数后添加其他渠道，也可以在url中添加更多需要采集的参数放置imgtaginthepromotionalcontent现在可以展开了，也可以去散散步喝咖啡收集日志分析。完成埋点采集后，我们可以使用日志服务LogSearch/Analytics功能对海量日志数据进行实时查询和分析。在结果分析和可视化方面，除了内置的Dashboard，还支持DataV、Grafana、Tableua等多种对接方式。这里我们做一些基本的演示：下面是目前收集到的日志数据。我们可以在搜索框输入关键字进行查询：也可以在查询后输入SQL进行秒级实时分析和可视化：除了日志服务中的分析，下面是我们对用户的实时分析点击/阅读日志：当前总流量和阅读次数*|selectcount(1)asc每小时阅读量曲线*|selectcount(1)asc,date_trunc('hour',from_unixtime(__time__))astimegroupbytimeorderbytimedesclimit100000各频道阅读量比例*|selectcount(1)asc,fgroupbyfdesc读数来自哪些设备*|选择count_if(ualike'%Mac%')作为mac，count_if(ualike'%Windows%')作为win，count_if(ualike'%iPhone%')作为ios，count_if(ualike'%Android%')asandroid阅读量来自哪些省市*|selectip_to_province(__source__)asprovince,count(1)ascgroupbyprovinceorderbycdesclimit100更多字段和分析场景，请参考分析语法和最佳实践。最后，可以将这些实时数据配置成一个实时刷新的Dashboard，效果如下：