网页端数据采集的设计思路和规范
项目命名
YAS (YOHO! Acquisition System) YOHO!采集系统的前端js的开发包,用于在网页端采集信息(应用信息,用户信息,用户行为信息,浏览器及其系统信息)。
概述
浏览器端的数据采集的嵌码,主要是两种:一种是通过JS生成cookies作为访客唯一标示,通过JS的能力获取网页端的一些数据,定时发起Ajax请求或者img图片,异步发送数据到服务端,在一些不支持JS的客户端采用嵌入一个透明1像素图片,在打开图片时被动的发起获取图片的HTTP请求(中间可以加一些http的传参)。
第一种方式:可以通过JS采集的内容和频次较为丰富和灵活。
第二种方式:只能通过图片的请求在服务端进行对HTTP的解析获取有限的内容。
使用场景
这两种的使用场景:分别是浏览器和不解析JS的邮件客户端。
关于嵌入图片
图片采集方式:客户端实现较为简单,只需要嵌入一个 <img src="http://a.yoho.cn/a.gif"/>
即可,不在本项目重点实现的内容,需要服务端获取get请求的自定义参数以及http headers,按照一定格式存储即可。
JS嵌码部分,百度和谷歌传参规范
cc:1
ck:1//是否支持cookies
cl:24-bit //色彩深度
ds:1920x1080 //屏幕尺寸
ep:55400151,12430 //页面载入时长
et:3
fl:16.0//flash版本
ja:1
ln:zh-CN //语言
lo:0
lt:1421118345//首次访问时间
nv:0
rnd:110278964//随机数
si:c816cea5705c8a8d992e813549e4780f//统计ID
st:4
v:1.0.75//监控代码版本
lv:2
u:http://www.yohoboys.com/whatever-cn-zh-hk-web.html//url
GA:http://www.google-analytics.com/r/collect?v=1&v=j32&a=842371998&t=pageview&_s=1&dl=http%3A%2F%2Fwww.yohoboys.com%2Fwhatever-cn-zh-hk-web.html&ul=zh-cn&de=UTF-8&dt=Yoho!Boys%20%7C%20We%20love%20to%20Play%20%26%20Learn&sd=24-bit&sr=1920x1080&vp=1903x955&je=1&fl=16.0%20r0&u=MACAAEQBI~&jid=2128925385&cid=1603005881.1414387412&tid=UA-52595809-1&_r=1&z=1237056998
v:1
_v:j32
a:842371998
t:pageview//跟踪类型
_s:
dl:http://www.yohoboys.com/whatever-cn-zh-hk-web.html//url
ul:zh-cn//语言
de:UTF-8 //编码
dt:Yoho!Boys | We love to Play & Learn //title
sd:24-bit //屏幕色彩深度
sr:1920x1080 //屏幕尺寸
vp:1903x955 //实际可视尺寸
je:1
fl:16.0 r0//flash版本
_u:MACAAEQBI~
jid:2128925385
cid:1603005881.1414387412//统计访客ID
tid:UA-52595809-1//跟踪ID
_r:1
z:1237056998
根据现有数据分析嵌码,我们需要实现什么?
这个SDK主要用于web页面的浏览器或客户端的数据采集,包含应用信息,用户信息,浏览器及其系统信息
应用数据(Appliaction Info)可以采集的项:
名称 | 说明 | 缩写 |
---|---|---|
tid | 跟踪ID | td |
vid | 访问ID | vd |
host | 主机名 | h |
port | 端口 | p |
url | 链接 | u |
anchor | 锚点 | a |
code | 编码 | c |
loadFinishTime | 加载时长 | ft |
title | 标题 | dt |
用户信息(Customer Info)可以采集的项:
名称 | 说明 | 缩写 |
---|---|---|
client_id | 访客唯一标示 | cd |
uid | 会员ID | ud |
referer | 来源 | rf |
lasttime | 上次访问时间 | lt |
mousePosition | 鼠标位置 | mp |
event | 用户页面事件 | ev |
scrollTop | 页面滚动 | st |
浏览器信息(Browser Info)
名称 | 说明 | 缩写 |
---|---|---|
screenWidthxscreenHeight | 屏幕宽度x屏幕高度 | sr |
windowWidthxwindowHeight | 窗口宽度x窗口高度 | wr |
screenDepth | 屏幕色深 | sd |
language | 语言 | ln |
browserVersion | 浏览器信息 | bv |
systemInfo | 操作系统信息 | sy |
cookiesEnabled | cookies是否启用 | ce |
flashVersion | flash版本 | fv |
自定义跟踪
主要有两种方式:自定义调用方法和自定义页面元素标志属性
自定义调用方法传参列表<a href='aa' onclick="_yas.add('event/page','type/url','action','label','value')" > index </a>
。
自定义页面元素标志属性<a href='aa' _yas_trackType='event' _yas_input='nav' _yas_action='click' _yas_label='show' _yas_val='prize' >index</a>
参数名 | 说明 | 范例 |
---|---|---|
trackType | 跟踪类型;event页面事件,page页面点击 | event |
input | 输入类型,如果是event,设置类型,如果是page则是点击的链接或者标示输入 | nav |
action | 动作 | click |
label | 设置标签,统计维度 | show |
value | 标签数值,统计值 | prize |
配置参数
主要参数有:定时采集频次,SDK版本信息,采集应用跟踪编码
(
function(w,d,s,j)
{
var a=d.createElement(s),
var m=d.getElementsByTagName(s)[0];
a.async=1;
a.src=j;
m.parentNode.insertBefore(a,m);
}
)(window,document,'script','//ya.yoho.cn/ya.js');
_yas(45,'1.0','ds6das2kkj');
发送采集数据的方式:
Ajax方式和img标签方式,Ajax主要用于用户行为数据收集,img方式的第一次记录应用信息,访客标示,浏览器信息。
一次性发送信息:浏览器信息(Browser Info),应用数据(Appliaction Info), 部分用户信息
- viewId(当次访问页面的ID)
- client_id(访客唯一标示)
- uid(会员ID)
- referer(来源)
- lasttime(上次访问时间)
定时发送信息:
自定义跟踪信息,部分用户信息
- viewId(当次访问页面的ID)
- mousePosition(鼠标位置)
- event(用户页面事件)
- scrollTop(页面滚动)
定时采集频次
- 默认30s发送一次用户数据
- 当用户打开页面发送一次请求,同时记录用户数据
- 当用户关闭浏览器,在浏览器端记录持久化,下次打开页面一并发送
关于session需要在服务端进行维护和记录
服务端根据客户端记录的访客标示,生成一个session会话,用于记录访问时长。