本篇主要介绍使用JS SDK收集浏览器端的数据,附件是我们提供的JS库,使用它可以非常方便的收集浏览器端的信息,比如用户操作系统类型、浏览器类型和版本、屏幕分辩率等。除此以外,JS SDK还支持收集用户自定义的数据,比如在事件响应中收集特定的信息。
JS SDK提供了一种非常灵活的前端页面代码埋点方式,您可以使用JS SDK将您关心的任何数据写入日志服务,后续可以在日志服务中消费这些数据,比如导入ODPS、OSS,也可以使用Client Library进行自定义消费,下面将介绍下JS SDK的使用方法。
使用方法
step 1: 开通logstore的web tracking功能。
目前控制台暂不支持设置logstore支持tracking,如果要使用该功能,请先使用java sdk或者提工单给我们,工单里面列出需要开通的project、logstore。
使用java sdk请先引入maven地址:
<dependency>
<groupId>com.aliyun.openservices</groupId>
<artifactId>aliyun-log</artifactId>
<version>0.6.3</version>
</dependency>
import com.aliyun.openservices.log.Client;
import com.aliyun.openservices.log.common.LogStore;
import com.aliyun.openservices.log.exception.LogException;
public class WebTracking {
static private String accessId = "your accesskey id";
static private String accessKey = "your accesskey";
static private String project = "your project";
static private String host = "log service data address";
static private String logStore = "your logstore";
static private Client client = new Client(host, accessId, accessKey);
public static void main(String[] args) {
try {
//在已经创建的logstore上开通tracking功能
LogStore logSt = client.GetLogStore(project, logStore).GetLogStore();
client.UpdateLogStore(project, new LogStore(logStore, logSt.GetTtl(), logSt.GetShardCount(), true));
//关闭tracking功能
//client.UpdateLogStore(project, new LogStore(logStore, logSt.GetTtl(), logSt.GetShardCount(), false));
//新建支持tracking功能的logstore
//client.UpdateLogStore(project, new LogStore(logStore, 1, 1, true));
}
catch (LogException e){
e.printStackTrace();
}
}
}
step 2: 将loghub-static-tracking.js复制到web目录,在页面中引入如下脚本。
<script type="text/javascript" src="loghub-static-tracking.js"></script>
step 3:构造tracker对象,并替换其中的<endpoint>、<project>、<logstore>,构造方法中最后一个参数是可选参数,用于从cookie中获取session id,不填写则使用默认值'JSESSION'。
var logger = new window.Tracker('<endpoint>','<project>','<logstore>','<session key name>');
举例如下:
var logger = new window.Tracker('cn-hangzhou-staging-intranet.sls.aliyuncs.com','ali-test-tracking','test');
step 4:收集数据,例子如下:
//填写日志key/value字段
logger.push('key1','value1');
logger.push('key2','value2');
//调用系统提供的收集函数
window.Agent(logger);
//发送日志数据
logger.logger();
window.Agent函数会收集如下字段:
字段 | 说明 | 例子 |
---|---|---|
_ua_ | 浏览器类型以及版本 | Chrome: 50.0.2661.102 |
_os_ | 操作系统类型 | Win7 |
_scr_ | 屏幕分辨率 | 1920*1080 |
_title_ | 页面标题 | Aliyun |
_ref_ | 来源地址 | |
_url_ | 页面地址 | http://10.101.166.127/tracking.html |
_can_ | cookie信息 | userId=828; userName=hulk |
_sid_ | session id |
时间: 2024-10-01 11:46:25