当我们在Taptap*问某款游戏时,比如https://www.taptap.com/app/34762,taptap会记录下这次访问,它是怎么做的呢。
首先,用记事本打开这个网址,在head部分看到下面这行引用,继续打开这个js
<script type="text/javascript" src="https://static.taptapdada.com/scripts/tracker.js" async></script>
(function (window, document) {
function createHttpRequest() {
if (window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
} function LogTracker(host, project, logstore) {
this.uri_ = 'https://' + project + '.' + host + '/logstores/' + logstore + '/track?APIVersion=0.6.0';
this.params_ = [];
this.httpRequest_ = createHttpRequest();
} LogTracker.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 log service because of this exception:\n" + ex);
console.log("Failed log data:", url);
}
} }
};
window.Tracker = LogTracker;
})(window, document);
这里定义了LogTracker这样日志跟踪类,并提供了参数供调用方填写,回到之前的html代码,寻找这个类调用的地方
<script>
$(function () {
var logger = new window.Tracker('cn-beijing.log.aliyuncs.com', 'tap-snow', 'logs');
logger.push('platform', 'web');
logger.push('device', navigator.userAgent);
logger.push('type', 'pageView');
logger.push('paramUrl', 'https://www.taptap.com/app/34762');
logger.push('paramReferer', document.referrer);
logger.logger();
});
</script>
这里看到页面访问时,会访问 https://tap-snow.cn-beijing.log.aliyuncs.com/logstores/logs/track?APIVersion=0.6.0&platform=web&device=...