干货:如何在前端统计用户访问来源?

用户来源是网站数据分析中一个重要的指标,然而想要准确的统计来源却并没有唯一的方法。下面我们针对获取来源的方式、来源的定义做一些具体的阐述;并且以 sensorsdata.cn 这个网站为例来做具体的来源分析。

1.前端获取来源的两种方式

1.1 通过给页面加自定义参数来标志

第一种方案,是通过给页面加自定义参数来标注用户的来源,我们暂且把这个来源叫做from

例如,我们将这个地址www.sensorsdata.cn?from=weibo通过营销人员在微博中转发,然后我们网站通过解析参数from就能取到来源weibo。 
对于这里的 from 这个自定义的参数,谷歌有个标准。一般来说可以用utm_source=weibo这样来标记来源。其他的还有utm_medium utm_campaign utm_content utm_term等等,可以自行搜索下。

1.2 通过referrer实现

第二种方案,是通过用户访问的referer来定义用户的来源,我们暂且把这个来源叫做referrer

比如用户在 baidu 中搜 'sensorsdata',然后跳转到了 'www.sensorsdata.cn'。那我们通过document.referrer能取到来源是'http://www.baidu.com/link?url=2fhHMI-7QopsGnGaJppRU8suX290yzANr3PNY8fupUy&wd=&eqid=bbd4f5c00001ec4a0000000356a83851'。

由于referer的 URL 可能取值太多,那么更进一步,可以专门取一下 referer 的 host,用这个来做来源的标志。

1.3 两种来源的综合

如上面所描述的那样,我们会有两种来源方式,一个是我们做标记的来源 from,一个是固有的 referrer。我们既可以把这两个来源都统计,也可以先取自定义标签 from 再取 referrer(示例如下)。

if(自定义from){  
  来源 = 自定义from
}else{
  来源 = document.referrer
//因为referrer取的过长,可以只取host如`baidu.com`
  来源 = 只截取referrer的host
}

sa.track('user_from',{from:来源,detail:document.referrer})  


2. 来源的3种定义

2.1. 用户首次打开页面的时候的首次来源

在这里,我们把用户首次打开页面的时候的首次来源叫initial_referrer。 这里的 referrer 可以作为用户的固有属性,类似于姓名,也即是 Sensors Analytics 中的 profile 属性。

在 JS-SDK 中可以这么实现:

//在引入js-sdk后加入以下代码
sa.setOnceProfile({initial_referrer:document.referrer})  

这个来源只会 set 一次,也就是一个浏览器端,只会有一个来源。


2.2 一个访问周期内的访问来源

一个访问周期,也即用户打开浏览器到关闭浏览器这个周期内的第一次来源,我们把他叫做session_referrer

正常情况下,我们可以设置一个不加时间的 cookie 来标志这个网站的session周期。然而我在测试了一些浏览器后,发现并不理想。mac下safari和firefox,直接按关闭按钮关闭浏览器,cookie还是存在的,但是点浏览器退出后,cookie是会清除掉的。而在mac下的chrome浏览器,设置cookie后,关闭浏览器,重新打开还是会存在。所以通过这个方式并不靠谱。 
不过我们可以通过设置一个限时的cookie来实现,比如60分钟的session周期。这样所有浏览器都能实现。也就是用户打开页面,然后60分钟内的操作,这里的来源都认为是一个来源。60分钟后再打开页面,就认为是新的来源。

//页面打开后
if(cookie中取到startFrom){  
  来源 = cookie中的来源
}else{
  来源 =  当前来源
  setCookie('startFrom', 当前来源, 60分钟)
}


2.3 每个页面的访问来源

这个就是通常意义上的referrer 了,在每个页面访问时,都取referrer。

3. sensorsdata.cn的来源分析

sensorsdata会获取initial_referrerinitial_from

sa.setProfileOnce({  
  initialReferrerUrl: document.referrer,
  initFromUrl: '根据url解析出来的来源'
})

sensorsdata会在每次页面打开的时候,取from和referrer

sa.track('page_open',{from:'解析url来源',referrer:document.referrer,referrerHost:''})  

当然这里会有重复,如果是自己网站内的跳转,如果需要过滤的话,可以自行做判断过滤。

4. 其它

客户 A 只想取某个页面的自定义来源做为需求的来源

if(这个页面有自定义来源){  
  sa.setProfileOnce({fromUrl:自定义来源});
}
展开阅读全文

没有更多推荐了,返回首页