工作区-google-analytics

如果您要构建的应用可在离线状态下运行,那么了解用户在没有连接的情况下如何与您的应用互动,对于优化该体验至关重要。

分析服务提供商(如 Google Analytics 需要使用广告网络 将数据发送到服务器,这意味着如果连接 这些请求将失败,这些互动也将 您的分析报告中缺少哪些数据一切好像从未发生过。

Workbox Google Analytics 为 Google Analytics 用户解决了这个问题,具体方法为: 利用 Service Worker 的功能检测失败的请求。

Google Analytics 通过向 Measurement Protocol 这意味着 Service Worker 脚本可以添加一个提取处理程序来检测 向 Measurement Protocol 发送失败的请求它可以将这些请求存储在 IndexedDB 中,然后在连接恢复后稍后重试。

Workbox Google Analytics 正是为此而生。还会添加 来缓存 analytics.js 和 gtag.js 因此它们也可以离线运行。最后,当失败的请求 Workbox Google Analytics 还会自动设置(或更新) qt ,以确保 Google Analytics 中的时间戳反映 初始用户互动的时间

启用 Workbox Google Analytics

如需启用 Workbox Google Analytics,请调用 initialize() 方法:

import * as googleAnalytics from 'workbox-google-analytics';

googleAnalytics.initialize();

这是将失败的请求加入队列并重新尝试 它是让 Google Analytics 正常运行的最简单方法 离线使用。

不过,如果只使用上述代码,重试的请求将 这与首次尝试成功的请求无法区分。这意味着 您将会收到来自线下用户的所有互动数据, 能够判断出用户离线时发生了哪些互动。

为了解决此问题,您可以使用 来修改或注释在 重试请求。

修改要发送的数据

如果您希望能够区分重试的请求和未重试的请求,可以指定 parameterOverrides 或 hitFilter 配置选项。

利用这些选项,您可以修改 Measurement Protocol 参数 发出的所有请求如果您想为每个重试请求的特定参数设置相同的值,则应使用 parameterOverrides 选项。如果需要在运行时计算特定参数的值或从其他参数的值派生值,则应使用 hitFilter 选项。

以下示例展示了如何使用这两种选项。

示例

使用自定义维度跟踪线上和线下互动

Google Analytics 没有用于衡量线上与线下互动的内置维度。不过,您可以自行创建维度 一种称为 自定义维度。

如需使用 Workbox Google Analytics 与自定义维度一起跟踪由服务工件重放的请求,请按以下步骤操作:

  1. 创建新的自定义维度 。为其命名,例如“网络状态”并将其设置为 将范围限定为“匹配” (因为任何互动都可能是线下的)。
  2. 记下为新创建的维度指定的索引,然后将 将其作为参数名称传递给 parameterOverrides 配置选项 添加到 Workbox Google Analytics 代码中。

    例如,如果这是您的第一个自定义维度,则其编号为 1,参数名称为 cd1(如果编号为 8,则为 cd8):

    import * as googleAnalytics from 'workbox-google-analytics';
    
    googleAnalytics.initialize({
      parameterOverrides: {
        cd1: 'offline',
      },
    });
    
  3. (可选)由于仅应用 parameterOverrides 中的值 重试(“离线”)请求,您可能还需要设置一个默认值 /“在线”所有其他请求。虽然这不是绝对必要的 将使报告更易于阅读

    例如,如果您使用默认的 analytics.js 跟踪代码段安装 Google Analytics,则可以添加 ga('set', 'dimension1', 'online') 行,以便为服务工件未重放的所有请求使用“网络状态”自定义维度的默认值 'online'。

    <script>
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
    
      ga('create', 'UA-XXXXX-Y', 'auto');
    
      // Set default value of custom dimension 1 to 'online'
      ga('set', 'dimension1', 'online');
    
      ga('send', 'pageview');
    </script>
    

使用自定义指标跟踪请求在队列中花费的时间

如果您想知道某次离线访问之间经过了多长时间 但连接恢复的时间和请求的状态, 重试之后,您可以使用 自定义指标和 hitFilter 配置选项:

  1. 创建新的自定义指标 。为其命名(例如“离线队列时间”),将其范围设置为“命中”,并将其格式设置类型设置为“时间”(以秒为单位)。
  2. 使用 hitFilter 选项可获取 qt param 并将其除以 1000(可转换为秒)。然后,将该值作为参数设置为新创建的指标的索引。如果这是您 第一个自定义指标,参数名称将为 'cm1':

    import * as googleAnalytics from 'workbox-google-analytics';
    
    googleAnalytics.initialize({
      hitFilter: (params) => {
        const queueTimeInSeconds = Math.round(params.get('qt') / 1000);
        params.set('cm1', queueTimeInSeconds);
      },
    });
    

测试 Workbox Google Analytics

由于 Workbox Google Analytics 使用后台同步功能重放事件,因此它可以 测试起来不够直观如需了解详情,请参阅测试 Workbox 后台同步。

类型

GoogleAnalyticsInitializeOptions

属性

  • cacheName

    字符串(选填)

  • parameterOverrides

    对象(可选)

  • hitFilter

    void 可选

    hitFilter 函数如下所示:

    (params: URLSearchParams) => {...}

    • params

      URLSearchParams

方法

initialize()

workbox-google-analytics.initialize(
  options?: GoogleAnalyticsInitializeOptions,
)
: void

参数