页面埋点&nginx日志采集

采集页面（web容器：httpd/nginx负载均衡 + apache server）<===> 日志采集服务器（nginx服务器）

通过某个页面跳转到我们的页面；
我们页面一渲染完成加载埋点的js，执行业务逻辑采集信息；
采集页面完成之后，访问log.gif，把参数拼接在args发送给采集服务器；
采集服务器返回一个1*1空的图片，断开连接。

采集页面埋点（在页面body最后埋js）

<script type="text/javascript">
    var _maq = _maq || [];
    _maq.push(['_setAccount', 'zx5352']);

    (function() {
        var ma = document.createElement('script'); 
        ma.type = 'text/javascript';
        ma.async = true;
        ma.src = 'http://xxxxxx/ma.js';
        var s = document.getElementsByTagName('script')[0]; 
        s.parentNode.insertBefore(ma, s);
    })();
</script>

采集服务器js

(function () {
    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 || ''; 
    }   
    //解析_maq配置
    if(_maq) {
        for(var i in _maq) {
            switch(_maq[i][0]) {
                case '_setAccount':
                    params.account = _maq[i][1];
                    break;
                default:
                    break;
            }   
        }   
    }   
    //拼接参数串
    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://xxxxxx/log.gif?' + args;
})();

采集服务器nginx配置

worker_processes  2;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    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";

    access_log  logs/access.log  tick;

    sendfile        on;

    keepalive_timeout  65;

    server {
        listen       80;
        server_name  localhost;
        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 /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;

            #打开日志
            log_subrequest on;
            #记录日志到ma.log，实际应用中最好加buffer，格式为tick
            access_log /var/nginx_logs/ma.log tick;

            #输出空字符串
            echo '';
        }
    }
}

页面埋点&nginx日志采集

页面埋点&nginx日志采集

猜你喜欢