SLS WebTracking JavaScript Logging SDK

背景信息

阿里云日志 web tracking 兼容谷歌插件 V3 版本特制

• 干掉了里面的XMLHttpRequest换成了Fetch
• 延迟发送被干掉了，因为V3中需要分离逻辑，编程alarms发送，而这只是一个类库，不是注入代码
• 必须安装 webextension-polyfill 使用 browser
• 因为V3版本 给回调函数时，走回调函数，否则返回Promise 因为browser仍然可用
• 该版本兼容V2 和 V3

数据采集

控制台方式

1. 登录日志服务控制台。
2. 单击目标 Project。
3. 找到目标 Logstore，单击下的修改。
4. 在Logstore 属性页面，单击右上方的修改。
5. 打开WebTracking开关，并单击保存。

通过 JavaScript SDK 方式进行数据的采集

1.安装依赖包

npm install --save js-sls-logger-v3

2.import在您的应用程序模块。

import SlsWebLogger from "js-sls-logger-v3";

3.配置参数 opts。

| 参数 | 说明 | 是否填写 | | :----------: | :---------------------------------------------------------------------------------------------------------------------------------: | :------------------------: | | host | 日志服务所在地域的 Endpoint，详情请参见服务入口 | 必填 | | project | 控制台创建的 project 名称。 | 必填 | | logstore | 控制台创建的 logstore 名称。 | 必填 | | time | 发送消息的时间间隔,数据格式为 Number 的方式,time*1000(毫秒)。 | 选填(默认是 10 秒) | | count | 发送消息的数量大小,数据格式为 Number 的方式。 | 选填(默认是 10 条数据) | | compress | 是否启用压缩。 | 选填（默认为 true） |

const opts = {
  host: "${host}", // 所在区域的host
  project: "${project}", // project名称
  logstore: "${logstore}", // logstore名称
  time: 10, // 定义时间，默认是10秒，number类型，选填
  count: 10, // 定义数据条数，默认是10条，number类型，选填
  compress: true, // 是否启用压缩，默认为true
};

4.创建 SlsWebLogger 对象。

const logger = new SlsWebLogger(opts);

5.上传日志。

logger.send({
  customer: "zhangsan",
  product: "iphone 12",
  price: 7998,
});

核心功能

send()

• 默认插件V3不能time设置是没有用的，如果想让time起作用
• 若想让time起作用，必须opt.alarm = true 且 配套下面的代码才能有效
• 默认情况下，若需要保证logger每次都能发出去，请将count设为1
• timer 可以在opt.timer 中自定义，为字符串类型

Alarms 辅助示例：

import SlsWebLogger from "js-sls-logger-v3";

const opts = {
    host: 'xxxxx',
    project: 'xxxxxx',
    time: 10,
    count: 3,
    // 测试
    logstore: 'xxx'
}
const logger = new SlsWebLogger(opts);

chrome.alarms.onAlarm.addListener(function (alarm){
    if(alarm.name === logger.timer){
        console.log("定时器开始了")
        logger.initSendLocalChunk()
    }
})

export default logger;