鸦杀's Blog

image打点主意事项

2016-06-17

最近在做打点的一些需求,看到了这篇文章。想起之前大数据那边的同学来找,说我们自己的打点和友盟打点的数据为什么差这么多。是否存在‘数据过大包丢失’的情况(这是在app那边查出来的问题)或者打点数据传输有问题。或许,new Image()这个问题也是一个原因吧。

以下是引用


网站分析中,我们经常会用new Image()的方式向服务器发送一条打点消息,例如:

1
(new Image()).src = "http://log.mysite.com/1.gif?a=1&b=2&c=xxx";

这种方式简单易用,因而被广泛采用。但上面这段代码的问题是这个new Image()是一个没有引用的临时变量,随时可能被浏览器的垃圾回收机制回收。如果这个图片的HTTP请求尚未建立,那么在被回收时这个请求就会被取消,导致打点并没有真正发出。如果打点所在的页面比较复杂,浏览器垃圾回收机制可能会被频繁触发,那么这种方式打点的丢失率可能会高达10%以上。

解决方法很简单,将这个图片赋值给一个全局变量即可,例如:

1
2
3
4
5
6
7
8
9
10
var img = new Image();  
var rnd_id = "_img_" + Math.random();

window[rnd_id] = img; // 全局变量引用

img.onload = img.onerror = function () {
window[rnd_id] = null; // 删除全局变量引用
}

img.src = "http://log.mysite.com/1.gif?a=1&b=2&c=xxx";

我是引用结束的分隔线

扫描二维码,分享此文章