js埋点

1.埋点作用:

   页面埋点的作用:其实就是用于流量分析。而流量的意思,包含了很多:页面浏览数(PV)、独立访问者数量(UV)、IP、页面停留时间、页面操作时间、页面访问次数、按钮点击次数、文件下载次数等。而流量分析又有什么用处?

  1) 网站统计

  网站统计是指通过专业的网站统计分析系统(或软件),对网站访问信息的记录并归类,以及在此基础山的统计分析,如网站访问量的增长趋势图、用户访问最高时间、访问最多的网页(模块)、停留时间、用户使用的搜索引擎等,主要关键词、来路、入口、浏览深度、使用语言、所用浏览器种类、时段访问量统计分析、日段访问量统计分析以及周月访问量统计分析等网站访问数据的基础分析。

  2) 提高网站的转化率

  根据页面埋点可得到一些重要信息,它告诉你用户对网站的反应,以及如何提高网站流量、改进网站性能,了解用户访问网站的行为,为更好地满足用户需求提供支持。

  3) 反应用户黏度

  即使网站吸引了很多用户访问,但是通过流量分析发现,用户停留的时间非常短,重复访问用户不多,用户平均浏览的页面也少,这样的网站用户黏度不够,有流量但是没有忠实的用户,一旦有其它可替代网站,用户随时可能流失。这样的网站,如果不采取有效的运营措施,很难有长期发。

  4) 为网站内容管理和网站的产品策划提供方向

  通过流量分析,可以挖掘出整个网站哪个频道最有人气,频道之间的流量比例是多少,每个页面的流量是多少,哪个页面最受欢迎,每个页面中具体的哪个栏目点击 量最高,这样通过对频道、栏目、页面的具体流量分析和对比,可以挖掘出用户的需求,发现用户最关心什么内容,这对评估网站频道、内容、页面的价值有重要的 参考作用,也对网站内容下一步的优化有直接的参考意义。

  比较常用的统计分析工具:谷歌分析、百度统计分析、腾讯统计分析等

2.埋点流程预览

  首先通过一幅图总体看一下数据收集的基本流程。

  首先,用户的行为会触发浏览器对被统计页面的一个http请求,这里姑且先认为行为就是打开网页。当网页被打开,页面中的埋点javascript片段会被执行,用过相关工具的朋友应该知道,一般网站统计工具都会要求用户在网页中加入一小段javascript代码,这个代码片段一般会动态创建一个script标签,并将src指向一个单独的js文件,此时这个单独的js文件(图1中绿色节点)会被浏览器请求到并执行,这个js往往就是真正的数据收集脚本。数据收集完成后,js会请求一个后端的数据收集脚本(图1中的backend),这个脚本一般是一个伪装成图片的动态脚本程序,可能由php、python或其它服务端语言编写,js会将收集到的数据通过http参数的方式传递给后端脚本,后端脚本解析参数并按固定格式记录到访问日志,同时可能会在http响应中给客户端种植一些用于追踪的cookie。

3.实际项目中的例子:

  1) 页面:

     <script type="text/javascript">
var bi_params = {
mobile : GetQueryString('phone'),
code : GetQueryString('phone'),
activityid : 'xiyijie',
pagetype : 'bindsuccess'
};
(function() {
var bi_hm = document.createElement("script");
bi_hm.src = "http://pic2.58.com/m58/app58/m_static/js/bi/tracker.js ";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bi_hm, s);
})();
</script>

  2) tracker.js

/*
* 设置cookie
*/
function setBICookie(name,value,days,domain){
try{
var exp = new Date();
exp.setTime(exp.getTime() + days*24*60*60*1000);
document.cookie = name + "=" + value + ";" + "expires=" + exp.toGMTString()+";path=/;" + (domain ? ("domain=" + domain + ";") : "");
}catch(e){}
}
/*
* 1.根据键取得对应的cookie
*/
function getBICookie(name) {
try{
var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
if(arr=document.cookie.match(reg))
return unescape(arr[2]);
else
return null;
}catch(e){}
}
/*
* 1.根据键删除对应的cookie
*/
function delCookie(name,domain){
try{
var date = new Date();
date.setDate(date.getDate() - 100000);
document.cookie = name + "=a; expires=" + date.toGMTString() + ";path=/" +";" + (domain ? ("domain=" + domain + ";") : "");
}catch(e){}
}
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
function trackClick(data){
try{
if("undefined" != typeof data){
writelog(data,"clickview");
}else{
writelog(null,"clickview");
}
}catch(e){}
}
function trackPageview(data){
try{
if("undefined" != typeof data){
writelog(data,"pageview");
}else{
writelog(null,"pageview");
}
}catch(e){}
}
function sendTrackerLog(a){(new Image).src=a}
function writelog(data,logtype){
var cookie_days = 730;//Cookie Save Days
var url = document.URL;
var cookie_domain = "." + url.replace(/http:\/\/.*?([^\.]+\.(com\.cn|org\.cn|net\.cn|[^\.\/]+))\/.+/, "$1");
var log_url = "http://xx.xxx.com/a.gif?r="+Math.random()+"&logv=1.0&type=" + logtype;
var bi_hmsr = "none";
if(getQueryString("hmsr")!=null&&getQueryString("hmsr")!=""){
bi_hmsr = getQueryString("hmsr");
setBICookie("bi_hmsr",bi_hmsr,cookie_days,cookie_domain);
}else{
if(getBICookie("bi_hmsr")!=null&&getBICookie("bi_hmsr")!=""){
bi_hmsr = getBICookie("bi_hmsr");
}else{
setBICookie("bi_hmsr",bi_hmsr,cookie_days,cookie_domain);
}
} var bi_hmmd ="none";
if(getQueryString("hmmd")!=null&&getQueryString("hmmd")!=""){
bi_hmmd = getQueryString("hmmd");
setBICookie("bi_hmmd",bi_hmmd,cookie_days,cookie_domain);
}else{
if(getBICookie("bi_hmmd")!=null&&getBICookie("bi_hmmd")!=""){
bi_hmmd = getBICookie("bi_hmmd");
}else{
setBICookie("bi_hmmd",bi_hmmd,cookie_days,cookie_domain);
}
}
var bi_hmpl ="none";
if(getQueryString("hmpl")!=null&&getQueryString("hmpl")!=""){
bi_hmpl = getQueryString("hmpl");
setBICookie("bi_hmpl",bi_hmpl,cookie_days,cookie_domain);
}else{
if(getBICookie("bi_hmpl")!=null&&getBICookie("bi_hmpl")!=""){
bi_hmpl = getBICookie("bi_hmpl");
}else{
setBICookie("bi_hmpl",bi_hmpl,cookie_days,cookie_domain);
}
}
var bi_hmkw ="none";
if(getQueryString("hmkw")!=null&&getQueryString("hmkw")!=""){
bi_hmkw = getQueryString("hmkw");
setBICookie("bi_hmkw",bi_hmkw,cookie_days,cookie_domain);
}else{
if(getBICookie("bi_hmkw")!=null&&getBICookie("bi_hmkw")!=""){
bi_hmkw = getBICookie("bi_hmkw");
}else{
setBICookie("bi_hmkw",bi_hmkw,cookie_days,cookie_domain);
}
}
var bi_cookieid = getBICookie("bi_cookieid");
if(bi_cookieid==null||bi_cookieid==""){
bi_cookieid=(new Date).valueOf()+""+parseInt(Math.random()*10000000000);
setBICookie("bi_cookieid",bi_cookieid,cookie_days,cookie_domain);
}
var referrer=encodeURIComponent(document.referrer);
if(referrer==null||referrer==""){
referrer="none";
}
log_url+="&hmsr="+bi_hmsr+"&referrer="+referrer+"&cookieid="+bi_cookieid +"&hmpl="+bi_hmpl +"&hmmd="+bi_hmmd+"&hmkw="+bi_hmkw;
if(data!=null&&logtype=="pageview"){
for(var key in data){
var value=data[key];
log_url += "&"+key+"=" + value;
}
}else if(data!=null&&logtype=="clickview"){
log_url += "&" + data;
}
sendTrackerLog(log_url);
}
try{
if("undefined" != typeof bi_params){
writelog(bi_params,"pageview");
}else{
writelog(null,"pageview");
}
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
//调用百度统计代码
hm.src = "//hm.baidu.com/hm.js?b63b6a99a304a1aa8ad31744d27c77e5";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
}catch(e){}

4.参考网址:

  1).http://www.admin10000.com/document/1089.html

  2).http://www.bubuko.com/infodetail-401972.html

网站js埋点的更多相关文章

  1. JS埋点 小结

    今天在看<大型网站性能监测.分析与优化>一书,提到性能监测方式,才知道有这个名词 “JS埋点”. 大概作用:通过在web页面中,添加js脚本,实现对页面性能监测(如加载时间.服务器响应时间 ...

  2. 网站数据采集|埋点设计|nginx日志文件

    数据获取的方式主要可以分为两种: 1.网站日志文件(log files) 页面埋点js自定义的采集. 优缺点: web服务器自带的日志记录功能:优点方便,缺点信息收集不全 自定义的js埋点收集:优点想 ...

  3. Rhino+envjs-1.2.js 在java运行网站js 工具类

    java爬虫遇到个页面加密的东西,找了些资料学习学习 做了个java运行js的工具类,希望对大家有用,其中用到client(获取js)可以自行换成自己的client.主要是用了 Rhino就是Java ...

  4. 网站JS控制的QQ悬浮

    这是一个网站JS控制的QQ悬浮客服:代码1document.writeln("<div id=\"feedback\"><div id=\"f ...

  5. 使用PHP和GZip压缩网站JS/CSS文件加速网站访问速度

    使用PHP和GZip压缩网站JS/CSS文件加速网站访问速度 一些泛WEB 2.0网站为了追求用户体验,可能会大量使用CSS和JS文件.这就导致在服务器带宽一定的情况下,多用户并发访问速度变慢.如何加 ...

  6. js埋点(转载)

    页面埋点的作用,其实就是用于流量分析.而流量的意思,包含了很多:页面浏览数(PV).独立访问者数量(UV).IP.页面停留时间.页面操作时间.页面访问次数.按钮点击次数.文件下载次数等.而流量分析又有 ...

  7. 怎样把网站js文件合并成一个?几种方法可以实现

    我们在建网站时经常会用js特效代码以使页面更美观,比如js幻灯片代码.js下拉菜单等,但是网页特效一多,如果js文件没有合并的话会降低网站的性能,这时我们就要考虑合并js文件了,ytkah总结了以下几 ...

  8. chrome禁用某个网站js脚本的执行

      1 首先打开谷歌浏览器.如下 2 点击右上角,打开菜单进入[设置] 3 打开后,第一个界面是没有这个的,要滚动到最后点击[显示高级设置...] 4 展开第二页后,点击[隐私设置]->[内容设 ...

  9. 各浏览器禁用某网站JS脚本的方法 【转】

    某些网站,经常会加载一些非常讨厌的JS脚本,如果我们想禁止这个网站的JS脚本,可以使用下面的方法: 一.IE浏览器 1.在Internet选项中,选择安全选项卡,然后点击受限制的站点,点击下面的站点 ...

随机推荐

  1. ubutu下source命令问题(复制)

    最近一段时间在使用Bash on Ubuntu on Windows做shell脚本调试时发现在脚本中使用source时会报错,上网查了下才了解到原来是在Ubuntu中使用的并不是bash,而是使用 ...

  2. 使用IMAGEMAGICK的CONVERT工具批量转换图片格式

    使用IMAGEMAGICK的CONVERT工具批量转换图片格式 http://www.qiansw.com/linux-imagemagick-convert-img.html Home > 文 ...

  3. python中字典的循环遍历的两种方式

    开发中经常会用到对于字典.列表等数据的循环遍历,但是python中对于字典的遍历对于很多初学者来讲非常陌生,今天就来讲一下python中字典的循环遍历的两种方式. 注意: python2和python ...

  4. Java开发环境配置时的dt.jar与tools.jar是什么(转载)

    你了解dt.jar吗 很多人在初学Java的时候,都要配置环境变量.在配置CLASSPATH的时候,都会加上一个当前目录.,还有两个jar:dt.jar和tools.jar.其实好多人都不了解这两个j ...

  5. Centos7安装GUI桌面

    2018-03-02 21:37:48 Centos7-1708成功 yum -y groupinstall "GNOME Desktop"

  6. 基于Thinkphp5+phpQuery 网络爬虫抓取数据接口,统一输出接口数据api

    TP5_Splider 一个基于Thinkphp5+phpQuery 网络爬虫抓取数据接口 统一输出接口数据api.适合正在学习Vue,AngularJs框架学习 开发demo,需要接口并保证接口不跨 ...

  7. js+jquery 常用选择器函数

    一.获取当前标签 JS: this,如下: <button onclick="fun(this)"></button> Jquery,如下: $(" ...

  8. Mapreduce简要原理与实践

    探索Mapreduce简要原理与实践 目录-探索mapreduce 1.Mapreduce的模型简介与特性?Yarn的作用? 2.mapreduce的工作原理是怎样的? 3.配置Yarn与Mapred ...

  9. 用Web Service实现客户端图片上传到网站

    由于项目需要,通过本地客户端,把图片上传到网站.通过webservice. 这是客户端代码: private void btnimg_Click(object sender, EventArgs e) ...

  10. Ural 1297 Palindrome(Manacher或者后缀数组+RMQ-ST)

    1297. Palindrome Time limit: 1.0 second Memory limit: 64 MB The “U.S. Robots” HQ has just received a ...