管理Google Analytics

了解用户和衡量用户行为是App开发中的重要一步。不幸的是，在使用Cordova包装移动应用程序后，需要一些非标准工作才能使Google Analytics工作。在纯Web应用程序中设置Google Analytics非常容易，但Cordova以某种方式阻止将浏览量和事件发送到Google Analytics。

遵循本指南将Google Analytics应用到Cordova包装的Quasar应用程序中。

重要
您需要在/src/index.template.html中包含Google提供的<script>标记，这会使您的应用程序依赖于Internet连接！

先决条件

准备

在我们开始将Google Analytics应用于您的应用程序之前，您需要有Google Analytics和Google Tagmanager的帐户 。所以我们首先注册帐户。当您拥有这些帐户时，是时候配置标签管理器了。按照Multiminds文章中的步骤操作。

将其实施到应用程序中

对于本指南，我们假设您拥有发送给Google Analytics的固定sessionId。 Google Analytics使用sessionId来区分不同的用户。如果要创建匿名sessionId，请参阅用户ID分析文档。

将标签管理器代码片段放置到您的index.html文件的头部（如果您已按照Multiminds文章做了，你已经有了这个。在你的代码库中创建一个名为analytics.js的新文件，内容如下：

export default {
  logEvent(category, action, label, sessionId = null) {
    dataLayer.push({
      'appEventCategory': category,
      'appEventAction': action,
      'appEventLabel': label,
      'sessionId': sessionId
    })
    dataLayer.push({ 'event': 'appEvent' })
  },

  logPage(path, name, sessionId = null) {
    dataLayer.push({
      'screenPath': path,
      'screenName': name,
      'sessionId': sessionId
    })
    dataLayer.push({ 'event': 'appScreenView' })
  }
}

为确保您的应用中的所有网页都自动发布到Google Analytics，我们创建了一个应用插件：

$ quasar new plugin google-analytics

Then we edit the newly created file: /src/plugins/google-analytics:

import ga from 'analytics.js'

export default ({ router }) => {
  router.afterEach((to, from) => {
    ga.logPage(to.path, to.name, sessionId)
  })
}

最后，我们在/quasar.conf.js中注册app插件。 我们只能在Cordova包装的应用程序里这样做：

plugins: [
  ctx.mode.cordova ? 'google-analytics' : ''
]

关于事件的更多信息可以在事件分析文档中找到。

运行应用时，您会看到事件和浏览量。 在实时视图中注册浏览量通常需要大约5到10秒的时间。

疑难解答和提示 发布到应用商店