小程序数据证明采集_Taro + ts 小程序中使用 Web Tracking采集数据

Web Tracking 简单来说，是做数据采集的，比如一些报错信息等，用于数据错误分析！

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

使用Web Tracking功能可以采集各种浏览器以及iOS/Android APP的用户信息(除iOS/Android SDK外)，例如：

用户使用的浏览器、操作系统、分辨率等。

用户浏览行为记录，例如用户网站上的点击行为、购买行为等。

用户在APP中停留时间、是否活跃等。

注意事项

使用Web Tracking意味着该Logstore打开互联网匿名写入的权限，没有经过有效鉴权，可能会产生脏数据。

仅支持GET请求，不支持POST请求。且不支持上传16KB以上的body。

POST请求限制与PutLogs一致，大小不超过3MB，条数不超过4096条。

步骤1 开通Web Tracking

通过控制台开通Web Tracking。

登录日志服务控制台，单击Project名称。

选择目标Logstore，进入Logstore属性页面。

方式1：单击Logstore下面的修改图标。

方式2：单击Logstore后面的

image 选择修改。

单击Logstore属性页面右上方的修改。

打开Web Tracking开关。

重点说，在Taro小程序框架下怎么使用追踪数据

1.首先对以下代码进行修改 loghub-tracking.js

(function(window, document){

function createHttpRequest()

{

if(window.ActiveXObject){

return new ActiveXObject("Microsoft.XMLHTTP");

}

else if(window.XMLHttpRequest){

return new XMLHttpRequest();

}

}

function AliLogTracker(host,project,logstore)

{

this.uri_ = 'http://' + project + '.' + host + '/logstores/' + logstore + '/track?APIVersion=0.6.0';

this.params_=new Array();

this.httpRequest_ = createHttpRequest();

}

AliLogTracker.prototype = {

push: function(key,value) {

if(!key || !value) {

return;

}

this.params_.push(key);

this.params_.push(value);

},

logger: function()

{

var url = this.uri_;

var k = 0;

while(this.params_.length > 0)

{

if(k % 2 == 0)

{

url += '&' + encodeURIComponent(this.params_.shift());

}

else

{

url += '=' + encodeURIComponent(this.params_.shift());

}

++k;

}

try

{

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

this.httpRequest_.send(null);

}

catch (ex)

{

if (window && window.console && typeof window.console.log === 'function')

{

console.log("Failed to log to ali log service because of this exception:\n" + ex);

console.log("Failed log data:", url);

}

}

}

};

window.Tracker = AliLogTracker;

})(window, document);

这里进行一步封装， 简化，抽取出我们自己需要的架构即可：

import Taro from '@tarojs/taro'

let params = new Array();

// 缓存数据

export const loggerPush = (key:any, value:any) => {

if(!key || !value) {

return;

}

params.push(key)

params.push(value)

}

// 上传日志

export const logger = () => {

let url = "" // 此处的需要自己组装，根据自己的阿里服务控制台

let k = 0

while(params.length > 0) {

if(k % 2 == 0){

url += '&' + encodeURIComponent(params.shift());

} else {

url += '=' + encodeURIComponent(params.shift());

}

++k;

}

try {

Taro.request({

url: url,

header: {

'content-type': 'application/json'

}

}).then(() => {})

// 清空暂存的params

params = []

} catch (ex) {

if (window && window.console && typeof window.console.log === 'function') {

console.log("Failed to log to ali log service because of this exception:\n" + ex);

console.log("Failed log data:", url);

}

}

}

使用方法

直接调用对应的方法即可

// 缓存数据

loggerPush('key'， ‘value’)

// 上传日志

logger()

到阿里，日志服务对应的项目查询：如下图

image.png

提示

在采集数据过程中，一定要注意逻辑的连贯性，这样才能保持数据的完整性。

如果遇到错误需要分析，可以更方便的解决！