如何将谷歌分析添加到 vaadin 应用程序？答案

【问题标题】：How to add google analytics to vaadin application?如何将谷歌分析添加到 vaadin 应用程序？
【发布时间】：2019-08-02 07:24:31
【问题描述】：

我正在使用带有弹簧靴的 Vaadin 12。我想在我的页面上添加谷歌分析。代码如下所示：

<script async src="https://www.googletagmanager.com/gtag/js?id=my-id"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'my-id');
</script>

如何将其添加到 Vaadin 的网页？我已经尝试使用注释@Inline，但它总是在那里放一些额外的东西。那么有没有办法将这些脚本放在 html 的头部？我只使用没有 HTML 页面的 java 类。

【问题讨论】：

标签： google-analytics vaadin-flow

【解决方案1】：

实际上有一个工作插件可用于在新的 Vaadin 10+ 项目中添加 Google 分析，它添加了跟踪器并提供了一些其他额外的 API，以便高级使用 Google Analytics。您可以从 Vaadin 目录中找到它

https://vaadin.com/directory/component/googleanalyticstracker/4.0.0

（Vaadin 7 和 8 也有类似的插件）。

Vaadin 应用程序是单页的，因此要充分利用 Google Analytics 对应用程序使用行为进行跟踪，您需要这种插件。它使虚拟页面查看成为可能，即您可以在 Google Analytics 中查看查看级别的活动。

为了将 JavaScript 简单集成到 html 的头部，您可以使用例如@Inline 注释，如下所述：https://vaadin.com/docs/flow/advanced/tutorial-bootstrap.html 但是，这不会为您提供视图级别跟踪。

【讨论】：

实际上这对我没有帮助。我真的需要将这些脚本放在 html 的头部。此外，该 repo 中提到它仅适用于 vaadin 版本 6、7 和 8