常见问题
最后更新于:2018-08-24 11:30:37
1 没有点击事件,控制台也看不到打印的数据
神策的点击事件是监听在 'document' 上的,如果阻止了事件的冒泡,就采集不到元素点击事件了。
2 vue 项目,首页触发两次 $pageview 事件
在main.js调用了sa.quick('autoTrack')之后,在路由切换的时候使用了sa.quick(“autoTrackSinglePage”),会有两次$pageview事件触发。
原因:vue框架下,首次打开页面也会导致路由触发。
解决:在main.js去掉sa.quick('autoTrack')
3 单页面中发送页面浏览事件($pageview)
1 pushState/replaceState 方式
如果用的是这种方式,因为 popstate 事件只有在浏览器后退前进才会触发,所以正常情况下的跳转页面,没法自动监听到。这种情况下,需要手动调用我们提供的 sa.quick('autoTrackSinglePage')
方法( SDK 1.8.5 版本以上可用)来封装 $pageview 的相关属性。这个方法在页面 url 切换后调用,比如 react 可以在全局的 onUpdate 里来调用。其他框架使用类似的在全局的在页面切换后调用。
// 比如现在是在 react 中
onUpdate: function(){
sa.quick('autoTrackSinglePage');
}
//vue 项目在路由切换的时候调用
router.afterEach((to,from) => {
Vue.nextTick(() => {
sa.quick("autoTrackSinglePage");
});
});
这里注意一下,代码生成工具中的自动生成的 sa.quick('autoTrack') 还是需要的,因为这里是首次发送页面浏览事件,切换页面后再调用上面的方法。
2 监听 hashchange 和 popstate 方式 (不建议使用)
hashchange 这种切换 url 的方式已经用的越来越少了。不过这种方式的页面切换,是可以自动监听到的。popstate 这个事件可以监听,但是因为只有在浏览器前进后退才会触发,页面跳转并不会触发,所以意义不大。针对上面这两种能自动监听到的事件,我们提供了 is_single_page 的参数配置,只要设置 is_single_page:true
就会自动在监听到 hashchange 或 popstate 事件,并自动发送页面浏览数据。
4 网页热力图显示的点击数据不准,手动计算点击数量跟事件分析统计的点击数量不一致
如果页面内容有改动,例如之前页面上有个按钮 A ,后来这个按钮被删除了。那这个按钮 A 的点击事件还在,这会导致事件分析的时候能统计到,但是网页热力
分析的时候就不能渲染这个按钮了。
5 网页热力分析 http 和 https 的问题
首先需要了解一下浏览器的安全性限制:
1 如果一个页面是使用 https 协议打开的,那么在这个页面里面是不能使用 http 协议请求图片、数据、或者 iframe 打开页面,因为都会被浏览器限制。
2 如果一个页面是使用 http 协议打开的,那么在这个页面里面是可以使用 https 协议请求图片、数据、或者 iframe 打开页面,因为浏览器不会受限制。
场景一:客户网站是 http 协议访问,神策后台管理是 https 协议访问。
1 这时候 $PageView 事件采集到了页面地址是 http 的。(例如 页面1 :http://www.abc.com/page1.html)
2 在网页热力分析页面,在列表里面 点击 页面1,这时候页面会使用一个 iframe 来加载 页面1。由于神策后台是 https 协议,页面1 是 http 协议,受浏览器限制,神策会提示使用 新标签页 打开。
3 点击使用新标签页打开,页面1 是 http 的,这时候页面会向神策后台请求页面点击数据,使用 https 请求。不受限制,可以正常使用。
场景二:客户网站是 https 协议访问,神策后台管理是 http 协议访问。
1 这时候 $PageView 事件采集到了页面地址是 https 的。(例如 页面1 :https://www.abc.com/page1.html)
2 在网页热力分析页面,在列表里面 点击 页面1,这时候页面会使用一个 iframe 来加载 页面1。由于神策后台是 http 协议,页面1 是 https 协议,不受限制,正常打开页面1。
3 页面1 打开后,这时候页面会向神策后台请求页面点击数据,使用 http 请求。由于页面1 是 https 的,受浏览器限制,请求数据异常。
4 Saas 版本默认支持 http 和 https,直接使用 https 访问就可解决问题。
私有部署版本,默认没有开启 https。需要客户自己开启 https。并更新神策后台地址,添加 https 地址。步骤如下:
a、开启神策 https 协议
b、更新神策后台地址
6 主域名跨域的两个网站,如何统一用户?
如果两个网站是子域名关系,sdk 初始化的时候配置 cross_subdomain 为 true 就行了。
如果两个网站是主域名跨域了,可以使用传递 district_id 的方式实现来两个网站的用户统一。
7 采集的数据不准确
如果你对 JavaScript SDK 的导入数据持有怀疑,想要验证数据导入是否靠谱。可以使用如下代码检测。
var counter = 0;
function test_script_1(){
setTimeout(function(){
if(++counter <= 500 ){
sa.track('test_script_1');
test_script_1();
}
},1000);
}
test_script_1();
上述代码,每秒钟会发一次 test_script_1 事件,总共发送500次,你可以修改次数和间隔。可以直接放在浏览器控制台执行。目前,客观环境都正常的情况下,准确率100%。
JavaScript SDK 如果有漏数据的情况,主要是这么几个情况:
- 网络环境。突然断线等异常导致数据发送不出去,这种情况难以避免,但是概率比较低。
- 浏览器环境。老版本浏览器容易崩溃以及异常,某些手机浏览器不支持 Cookie,或者禁用 JavaScript 等,还有浏览器时间异常,或者一些奇葩浏览器取到的值异常,建议用最新版本的 Chrome、Firefox 等浏览器。
- 发送的数据格式有误。建议在使用时,一定要看下控制台 console.log 出来的数据!并且在开发阶段使用 debug 模式,查看数据格式是否有问题。如果属性的类型不一致,事件名不规范,等情况都会导致丢数据,可以在数据导入辅助工具中查看错误原因。
- 代码逻辑复杂,自己认为会发送某个事件,其实因为程序出错或者逻辑疏忽导致没发,比如自己断定ajax 会成功,然后只在 success 里发了某个事件,这样是不合理的。
8 如何设置页面停留时间
神策分析 1.6 开始提供了 Session 分析功能,可以从页面浏览行为推算出用户大概的页面停留时间,一般情况下使用这个功能就足够了。而精确的页面停留其实是很难统计的,例如一个用户很可能同时打开多个网页窗口,然后一直不关闭。如果只是想要统计页面打开到关闭的时间,也可以参考以下代码:
window.onload = function() {
// 在页面加载完毕或者也不用加载完毕,定义一个初始时间
var start = new Date();
// 在页面关闭前,调用sa的track方法
window.onunload = function() {
var end = new Date();
// 如果用户一直不关闭页面,可能出现超大值,可以根据业务需要处理,例如设置一个上限
var duration = (end.getTime() - start.getTime()) / 1000;
// 定义一个记录页面停留时间的事件pageView,并且保存需要的属性(停留时间和当前页面的地址)
sa.track('pageclose', {
pageStayTime: duration,
pageUrl: window.location.href
});
};
}
9 如何设置页面加载时间
关于页面加载时间,首先要根据需求来选择对应的方法,以 window.onload 为例可以参考如下代码:
//在页面头部以同步的方式加载 js 代码
var start_time = new Date();
//定义起始时间
var end_time = "" ;
//定义结束时间
window.onload = function(){
end_time = new Date();
sa.track('pageLoadTime',{
loadTime:end_time.getTime() - start_time.getTime()
})
}
10 采集客户端 IP
在 JavaScript SDK 中不需要传入 $ip 属性。接收数据的服务端会自动解析访问者的 IP。如果您主动设置了 $ip 属性,将会使用你设置的 IP 属性。
11 统计所有页面的点击
神策分析的 SDK 提供了自动采集页面按钮( a button input 这种 html 标签类型)的点击,用户可以通过在配置中加如下参数来实现
heatmap: {},
web_url:'http://xxx.com'
设置之后,SDK 就会自动追踪页面上的按钮( a button input) 这种 html 标签类型 的点击情况,一旦页面某一个按钮发生了点击行为,我们就会去采集此按钮的一些信息,例如: 这个按钮的标签类型( a button input ),这个按钮的文本内容,这个按钮的 name ,这个按钮的 id 、 class 名,还有一些按钮特有的属性如 href 等。
关于 heatmap 参数的详细使用方法详见本页 1.4.2 。
需要注意的是,我们建议那些按钮不是很多的,相对简单的页面可以采用这个方法。 一般情况下,如果网页上的按钮比较多的话,因为每次按钮的点击都会发数据,会导数据量增大,可能会加磁盘。
12 统计来源相关问题
13 关于最近一次的属性取值介绍
13.1 $latest_referrer
最近一次站外地址(只要前向域名不是当前页面的域名,就会重置)
第一种 正常获取的属性值。 第二种 空:直接打开页面(包括收藏夹打开页面)。 第三种 未知:没取到属性的数据值或者是根本没传这个属性。 第四种 取值异常:因为 cookie 被清空了,或者前面一个页面是同域名的,但是没有嵌入sdk。
13.2 $latest_utm
最近一次付费广告系列参数(包括 utm_source、utm_medium、utm_term、utm_content、utm_campagin)
第一种 正常获取的属性值。 第二种 空:直接打开页面(包括收藏夹打开页面)。 第三种 未知:没取到属性的数据值或者是根本没传这个属性。 第四种 取值异常:因为 cookie 被清空了,或者前面一个页面是同域名的,但是没有嵌入sdk。
13.3 $latest_traffic_source_type
最近一次流量来源类型
第一种 正常获取的属性值(付费广告流量、自然搜索流量、社交网站流量、引荐流量、直接流量)。 第二种 空:直接打开页面(包括收藏夹打开页面)。 第三种 未知:没取到属性的数据值或者是根本没传这个属性。 第四种 取值异常:因为 cookie 被清空了,或者前面一个页面是同域名的,但是没有嵌入sdk。
13.4 $latest_search_keyword
最近一次搜索引擎关键词
第一种 正常获取的属性值。 第二种 未取到值:前向地址不是搜索引擎或着搜索引擎里没有关键词,或者关键词为空。 第三种 未知:没取到属性的数据值或者是根本没传这个属性。 第四种 取值异常:因为 cookie 被清空了,或者前面一个页面是同域名的,但是没有嵌入sdk。
14 在埋点管理中显示埋点信息
因为在 JavaScript 中会自动压缩打包等问题,且很难自动取到当前函数名,行号等信息。所以提供了手动传入埋点信息的方法。
sa.track('event',{$lib_detail:'类名##函数名##文件名##行号'});
// 例如一次点击导航菜单的事件,这里 $lib_detail 必须按照上面的格式来写,没有可以不填,但是必须有##做分隔符
sa.track('clickNav',{$lib_detail:'##clickNavFunc##nav.js##28'});
// profile也是相同的方式
sa.setProfile({$lib_detail:'####user.js##28'});
15 自定义渠道流量类型,搜索关键词
可以自定义判定渠道流量的条件 search 搜索引擎流量 , social 社交流量 , keyword 搜索引擎关键词
source_type :{
search: ['.baidu.com','.google.'],
social: ['.renren.com','.kaixin001.com'],
keyword: {baidu:['wd','word','keyword'],sogou:'query'}
}
可以先通过 sa.para.source_type.search 等方式,来查看目前已经定义的部分判定条件。
如果你有新的判断条件想要增加,可以通过上述代码,来扩展。
search 内容是数组,把 url 中包含特征的字符串作为判定条件,比如包含 .baidu.com 就认为是搜索引擎流量。
social 同上,也是包含特征字符串,就认为是社交流量。
keyword 内容是一个对象,key 是取的去掉域名后缀的字符串 , value 可以是关键词的字符串,也可以是一个包含有可能是关键词的数组。