全部产品
弹性计算 会员服务 网络 安全 移动云 数加·大数据分析及展现 数加·大数据应用 管理与监控 云通信 阿里云办公 培训与认证 更多
存储与CDN 数据库 域名与网站(万网) 应用服务 数加·人工智能 数加·大数据基础服务 互联网中间件 视频服务 开发者工具 解决方案 物联网 智能硬件
日志服务

Web Tracking

更新时间:2018-03-21 13:11:16

日志服务支持通过Web Tracking功能进行HTML、H5、iOS和 Android平台日志数据的采集,支持自定义维度和指标。

web_tracking

如上图所示,使用Web Tracking功能可以采集各种浏览器以及iOS、Android APP的用户信息(除 iOS/Android SDK 外),例如:

  • 用户使用的浏览器、操作系统、分辨率等。
  • 用户浏览行为记录,比如用户网站上的点击行为、购买行为等。
  • 用户在APP中停留时间、是否活跃等。

注意:使用Web Tracking意味着该Logstore打开互联网匿名写入的权限,可能会产生脏数据,请留意。

配置步骤

1 开通Web Tracking

您可以通过控制台或SDK方式开通Web Tracking。

  • 通过控制台开通Web Tracking

    1. 在Logstore列表页面,选中需要开通Web Tracking功能的Logstore,单击右侧的修改

    2. 打开 Web Tracking 开关。

      2

  • 通过 Java SDK 开通Web Tracking

    使用 Java SDK

    1. import com.aliyun.openservices.log.Client;
    2. import com.aliyun.openservices.log.common.LogStore;
    3. import com.aliyun.openservices.log.exception.LogException;
    4. public class WebTracking {
    5. static private String accessId = "your accesskey id";
    6. static private String accessKey = "your accesskey";
    7. static private String project = "your project";
    8. static private String host = "log service data address";
    9. static private String logStore = "your logstore";
    10. static private Client client = new Client(host, accessId, accessKey);
    11. public static void main(String[] args) {
    12. try {
    13. //在已经创建的Logstore 上开通Web Tracking功能。
    14. LogStore logSt = client.GetLogStore(project, logStore).GetLogStore();
    15. client.UpdateLogStore(project, new LogStore(logStore, logSt.GetTtl(), logSt.GetShardCount(), true));
    16. //关闭Web Tracking功能。
    17. //client.UpdateLogStore(project, new LogStore(logStore, logSt.GetTtl(), logSt.GetShardCount(), false));
    18. //新建支持Web Tracking功能的Logstore。
    19. //client.UpdateLogStore(project, new LogStore(logStore, 1, 1, true));
    20. }
    21. catch (LogException e){
    22. e.printStackTrace();
    23. }
    24. }
    25. }

2 收集日志数据

Logstore开通Web Tracking功能后,可以使用以下三种方法上传数据到Logstore中。

使用HTTP GET请求

  1. curl --request GET 'http://${project}.${host}/logstores/${logstore}/track?APIVersion=0.6.0&key1=val1&key2=val2'

其中各个参数的含义如下:

字段 含义
${project} 您在日志服务中开通的Project名称。
${host} 您日志服务所在地区的域名。
${logstore} ${project} 下面开通Web Tracking功能的某一个Logstore的名称。
APIVersion=0.6.0 保留字段,必选。
__topic__=yourtopic 指定日志的topic,保留字段,可选
key1=val1key2=val2 您要上传到日志服务的Key-Value对,可以有多个,但是要保证URL的长度小于16KB。

使用 HTML img 标签

  1. <img src='http://${project}.${host}/logstores/${logstore}/track.gif?APIVersion=0.6.0&key1=val1&key2=val2'/>
  2. <img src='http://${project}.${host}/logstores/${logstore}/track_ua.gif?APIVersion=0.6.0&key1=val1&key2=val2'/>

各个参数的含义同上,track_ua.gif除了将自定义的参数上传外,在服务端还会将http头中的UserAgent、referer也作为日志中的字段。

使用 js SDK

  1. loghub-tracking.js 复制到 web 目录,并在页面中引入如下脚本:

    点击下载

    1. <script type="text/javascript" src="loghub-tracking.js" async></script>

    注意:为了不阻塞页面加载,脚本会异步发送 HTTP 请求,如果页面加载过程中需要多次发送数据,后面的请求会覆盖前面的 HTTP 请求,看到的现象是浏览器中会显示Tracking 请求退出。使用同步发送可以避免该问题,同步发送请在脚本中执行如下语句替换:

    原始语句:

    1. this.httpRequest_.open("GET", url, true)

    替换最后一个参数变成同步发送:

    1. this.httpRequest_.open("GET", url, false)
  2. 创建Tracker对象。

    1. var logger = new window.Tracker('${host}','${project}','${logstore}');
    2. logger.push('customer', 'zhangsan');
    3. logger.push('product', 'iphone 6s');
    4. logger.push('price', 5500);
    5. logger.logger();
    6. logger.push('customer', 'lisi');
    7. logger.push('product', 'ipod');
    8. logger.push('price', 3000);
    9. logger.logger();

    其中各个参数的含义如下:

    字段 含义
    ${host} 您日志服务所在Region的endpoint。
    ${project} 您在日志服务中开通的Project名称。
    ${logstore} ${project} 中的Logstore的名称。

    执行以上命令后,可以在日志服务看到如下两条日志:

    1. customer:zhangsan
    2. product:iphone 6s
    3. price:5500
    1. customer:lisi
    2. product:ipod
    3. price:3000

后续步骤

数据上传到日志服务之后,可以使用日志服务查询分析功能实时检索、分析日志数据,并通过多样的可视化方案展示实时分析结果。也可以使用日志服务提供的 Loghub client library 消费数据。

本文导读目录