Fork me on GitHub

手把手教你做数据埋点

发表于 | 分类于 | | 本文总阅读量 次
字数统计: 888 | 阅读时长 ≈ 4

前端

埋点代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
function md (uid,pid,option) {
    var params = {};
    //Document对象数据
    if(document) {
        params.domain = document.domain || '';
        params.url = document.URL || '';
        params.title = document.title || '';
        params.referrer = document.referrer || '';
    }
    //Window对象数据
    if(window && window.screen) {
        params.sh = window.screen.height || 0;
        params.sw = window.screen.width || 0;
        params.cd = window.screen.colorDepth || 0;
    }
    //navigator对象数据
    if(navigator) {
        params.lang = navigator.language || '';
    }
    params.uid = uid||null;
    params.pid = pid||null;
    params.option = option||null
    //拼接参数串
    var args = '';
    for(var i in params) {
        if(args != '') {
            args += '&';
        }
        args += i + '=' + encodeURIComponent(params[i]);
    }
    //通过Image对象请求后端脚本
    var img = new Image(1, 1);
    img.src = 'http://127.0.0.1:9100/1.gif?' + args;
}

服务器

在这里面我们使用的是nginx的日志来收集数据

注意事项

下文中的配置文件可以直接拿来就用，但是需要修改几点

  • log_format 修改你需要记录的参数
  • i-log中自定义变量

以下为nginx的配置文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63

log_format tick “$msec^A$remote_addr^A$u_domain^A$u_url^A$u_title^A$u_referrer^A$u_sh^A$u_sw^A$u_cd^A$u_lang^A$http_user_agent^A$u_utrace^A$u_account^A$time_local^A$u_uid^A$u_pid^A$u_option”;

server {
		listen        9999;
		server_name   localhost;
		#charset koi8-r;
		location /1.gif {
			#伪装成gif文件
			default_type image/gif;
			#本身关闭access_log，通过subrequest记录log
			access_log off;
			access_by_lua "
			-- 用户跟踪cookie名为__utrace
			local uid = ngx.var.cookie___utrace
			if not uid then
			-- 如果没有则生成一个跟踪cookie，算法为md5(时间戳+IP+客户端信息)
			uid = ngx.md5(ngx.now() .. ngx.var.remote_addr .. ngx.var.http_user_agent)
			end
			ngx.header['Set-Cookie'] = {'__utrace=' .. uid .. '; path=/'}
			if ngx.var.arg_domain then
			-- 通过subrequest到/i-log记录日志，将参数和用户跟踪cookie带过去
			ngx.location.capture('/i-log?' .. ngx.var.args .. '&utrace=' .. uid)
			end
			";
			#此请求不缓存
			add_header Expires "Fri, 01 Jan 1980 00:00:00 GMT";
			add_header Pragma "no-cache";
			add_header Cache-Control "no-cache, max-age=0, must-revalidate";
			#返回一个1×1的空gif图片
			empty_gif;
		}
		location /dv_tj.gif{
			access_log off;
			default_type image/gif;
			empty_gif;		
		}
		location /i-log {
			#内部location，不允许外部直接访问
			internal;
			#设置变量，注意需要unescape
			set_unescape_uri $u_domain $arg_domain;
			set_unescape_uri $u_url $arg_url;
			set_unescape_uri $u_title $arg_title;
			set_unescape_uri $u_referrer $arg_referrer;
			set_unescape_uri $u_sh $arg_sh;
			set_unescape_uri $u_sw $arg_sw;
			set_unescape_uri $u_cd $arg_cd;
			set_unescape_uri $u_lang $arg_lang;
			set_unescape_uri $u_utrace $arg_utrace;
			set_unescape_uri $u_account $arg_account;
			set_unescape_uri $u_uid $arg_uid;
			set_unescape_uri $u_pid $arg_pid;
			set_unescape_uri $u_option $arg_option;
			#打开日志
			log_subrequest on;
			#记录日志到ma.log，实际应用中最好加buffer，格式为tick
			access_log /usr/local/src/ma.log tick;
			#输出空字符串
			echo '';
		}
		error_page  404              /404.html;
	}

日志处理

如果你的项目访问量特别大，可能需要做一次日志轮转，当然我的项目访问量不多，不做处理也无所谓

写一个shell脚本分割日志

1
2
3
4
5
6
7
8
# 你的nginx的日志的位置
base_path='/usr/local/nginx/logs'
log_path=$(date -d yesterday +"%Y%m")
day=$(date -d yesterday +"%d")
mkdir -p $base_path/$log_path
mv $base_path/access.log $base_path/$log_path/$access_$day.log
# 记得修改为你自己的位置
kill -USR1 `cat /usr/local/nginx/logs/nginx.pid`

添加定时任务

1
2
3
4
5
6
7
8
9
10
crontab -e
# 每天0时1分进行日志分割(建议在02-04点之间,系统负载小)
01 00 * * * /opt/nginx/logs/splitLog.sh  

重启Linux定时任务
crond restart

如果提示以下错误
crond: can't lock /var/run/crond.pid, otherpid may be 4141: 资源暂时不可用
删除/var/run/crond.pid 重新执行命令即可

参考

使用nginx lua实现网站统计中的数据收集

Nginx日志按天切割及日志基本配置说明

显示 Gitment 评论