本篇主要介绍使用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