Js嵌入网页的点码以实现数据采集

　　内容

　　概述: 分析网页上嵌入点的重要性

　　网站流量统计分析可以帮助网站管理员，运营商，发起人等获取实时网站流量信息，并提供来自流量来源，网站内容和网站访问者特征等各个方面的网站分析数据. 根据. 为了帮助增加网站流量，改善网站用户体验优化，允许更多访问者成为会员或客户，并通过减少投资获得最大收益.

　　访问日志指的是用户访问网站时的所有访问，浏览和单击行为数据. 例如，单击了哪个链接，例如常见的微信副本统计信息，页面访问者分析等，打开了哪个页面，复制了哪个微信帐户，使用了哪个搜索项目以及整个会话时间. 所有这些信息都可以通过网站日志保存. 通过分析这些数据，我们可以了解有关网站运营的许多重要信息. 采集的数据越全面，分析就越准确. 参考来源:

　　

　　网页隐藏点

　　

　　标题

　　首先，需要在网页的前端页面中加载ma.js的脚本代码

　　

var _maq = _maq || [];

_maq.push(['_setAccount', 'zaomianbao']);

(function() {

var ma = document.createElement('script');

ma.type = 'text/javascript';

ma.async = true;

ma.src = 'http://vtongji.gam7.com/ma.js';

var s = document.getElementsByTagName('script')[0];

s.parentNode.insertBefore(ma, s);

})();

　　二，将前端代码放在后台

　　

(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://vtongji.ibixue.com/log.gif?' + args;

})();

　　三，后端配置，配置nginx服务器日志格式

　　

worker_processes 2;

events {

worker_connections 1024;

}

http {

include mime.types;

default_type application/octet-stream;

log_format main '$remote_addr - $remote_user [$time_local] "$request" '

'$status $body_bytes_sent "$http_referer" '

'"$http_user_agent" "$http_x_forwarded_for"';

log_format user_log_format "$msec||$remote_addr||$status||$body_bytes_sent||$u_domain||$u_url||$u_title||$u_referrer||$u_sh||$u_sw||$u_cd||$u_lang||$http_user_agent||$u_account";

sendfile on; #允许sendfile方式传输文件，默认为off

keepalive_timeout 65; #连接超时时间，默认为75s

server {

listen 80;

server_name localhost;

location /log.gif {

#伪装成gif文件

default_type image/gif;

#nginx本身记录的access_log，日志格式为main

access_log logs/access.log main;

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_account $arg_account;

#打开subrequest（子请求）日志

log_subrequest on;

#自定义采集的日志，记录数据到user_defined.log

access_log logs/user_defined.log user_log_format;

#输出空字符串

echo '';

}

}

}

　　四: 编写index.html

　　

测试埋点

var _maq = _maq || [];

_maq.push(['_setAccount', 'zaomianbao']);

(function() {

var ma = document.createElement('script');

ma.type = 'text/javascript';

ma.async = true;

ma.src = 'http://yishengjun.gookang.com/ma.js';

var s = document.getElementsByTagName('script')[0];

s.parentNode.insertBefore(ma, s);

})();

测试埋点

　　五，背景nginx环境构建和参考资料

　　

web点数据采集后台配置nginx：

https://blog.csdn.net/weixin_37490221/article/details/80894827

下载数据源：

wget -O lua-nginx-module-0.10.0.tar.gz https://github.com/openresty/lua-nginx-module/archive/v0.10.0.tar.gz

wget --no-check-certificate -Oecho-nginx-module-0.58.tar.gz 'https://github.com/openresty/echo-nginx-module/archive/v0.58.tar.gz'

wget --no-check-certificate -O nginx_devel_kit-0.2.19.tar.gz https://github.com/simpl/ngx_devel_kit/archive/v0.2.19.tar.gz

wget https://openresty.org/download/openresty-1.9.7.3.tar.gz

wget --no-check-certificate -Oset-misc-nginx-module-0.29.tar.gz 'https://github.com/openresty/set-misc-nginx-module/archive/v0.29.tar.gz'

　　VI. 参考资料: