全部产品
业务实时监控服务 ARMS

进阶场景

更新时间:2017-09-01 10:30:25   分享:   

本文主要介绍在一些更复杂的场景中的 SDK 用法。

SPA 页面上报

SPA(Single Page Application)即单页面应用,在此类型的应用中,页面只会刷新一次。传统的方式只会在页面加载完成后上报一次 PV,而无法统计到各个子页面的 PV,也无法让其它类型的日志聚类到对应的子页面。

SDK 提供了两种 SPA 页面的处理方式:

1. 开启 SPA 自动解析

此方法适用于大部分以 URL hash 作为路由的单页面应用场景。

在初始化的配置项中,设置enableSPAtrue,即会开启页面的 hashchange 事件监听(触发重新上报PV),并将 URL hash 作为其它数据上报中的 page 字段。

enableSPA相配套的还有<Function>parseHash,参见 SDK 配置项

2. 完全手动上报

此方法可用于所有的单页面应用场景,如果方法一无法满足,可用此方法。

SDK 提供了setPage方法来手动更新数据上报时的 page name,调用此方法时,默认会重新上报页面 PV。

示例:

  1. // 监听应用路由变更事件
  2. app.on('routeChange', function (next) {
  3. __bl.setPage(next.name);
  4. });

对于页面初始化完成后的第一次 PV 上报,如果也想要手动控制,可在配置项中设置 autoSendPvfalse,然后在应用初始化完成后,调用setPage

数据预上报

场景一:在页面刚刚加载时,有一些数据需要上报,此时 SDK 可能还未初始化完成(或者不确定是否初始化完成)。

场景二:在应用的初始化逻辑中调用setConfig方法,但由于 SDK 是异步加载的,此时可能还未加载完成。

解决办法:

SDK 在__bl对象上增加了一个pipe属性,用于将预调用的信息缓存到此变量中。

例如:

  1. __bl.pipe = [
  2. // 将当前页面的html也作为一个api上报
  3. ['api', '/index.html', true, performance.now, 'SUCCESS'],
  4. // SDK初始化完成后即开启SPA自动解析
  5. ['setConfig', {enableSPA: true}]
  6. ];

如果只上报单条数据,也可以直接写成:

  1. __bl.pipe = ['msg', '我是另一个普通的消息'];

其中数组的第 0 个表示方法名,后面依次是入参。SDK 初始化完成后,就会将预先挂载到 window.__bl.pipe 上的方法及参数依次调用。

注意:在 SDK 初始化完成前,如果多次设置 __bl.pipe 的值,只会以最后一次为准。

pipe 也可以用于 SDK 初始化完成后调用(支持 IE9 及以上),如果不能确定 SDK 是否初始化完成,又不想添加太多的判断逻辑,可以使用此方式。

示例:

单页面应用中,设置 autoSend: false 后,在应用初始化后上报第一次 PV,此时并不确定 SDK 是否初始化完成。

  1. // 设置页面name为'homepage',并且上报PV
  2. __bl.pipe = ['setPage', 'homepage'];
本文导读目录
本文导读目录
以上内容是否对您有帮助?