javascript - GTM层不推送数据

Question

我正在开发一个混合应用程序，其中登录页面是用 php 编写的，其余应用程序是用 React 编写的。我想为相同的 SPA 实现谷歌分析。我正在 componentWillMount 中推送数据层，并且我的 gtm 脚本是通过 index.php 文件中的 php 代码添加的。

我面临的问题是第一次，每当页面从非 react 页面转换到 react 页面时，我的 GTM 层不会将数据推送到 gtm。如果在 react 页面中移动，一切正常。

非常感谢任何帮助。

谢谢

Answer 1

您遇到的问题在使用 SPA 时很常见。

让我举个例子:

1. 当您从 https://digitalmarketingbloq.com 搬家时到 https://digitalmarketingbloq.com/2018/08/07/how-to-filter-internal-traffic-in-google-analytics-with-google-tag-manager/浏览器与服务器进行通信。页面正在渲染中GTM 启动。
2. 在首页 View 的示例中您的 SPA，它工作正常，因为与服务器的通信已建立。但在 SPA 中从一页移动到另一页发生在客户端。 GTM 没有任何可采取的行动吗？

如何解决这个问题？

第一个选项是启用“历史记录”(变量 > 配置 > 历史记录)部分中的内置变量:

其次，创建一个在所有历史更改时触发的触发器(触发器 > 新建 > 历史更改):

在预览模式下，您可以检查 SPA 拾取的历史记录是否发生变化。在此处阅读有关变量的更多信息:https://support.google.com/tagmanager/answer/7182738?hl=en&ref_topic=7182737#history关于触发器在这里 https://support.google.com/tagmanager/answer/7679322?hl=en .

如果这不起作用，您需要在转换完成时在 SPA 中开发“虚拟页面 View ”事件。让我给你一些更多的观点。当从页面 A 到页面 B 的转换完成时，将触发以下事件:

  dataLayer.push({
    'virtualPageTitle': 'My Login Screen',
    'virtualPageURL': 'https://www.my-example/login',
    'event': 'VirtualPageview'
  });

上面的代码会将 virtualPageTitle 和 virtualPageURL 作为 VirtualPageview 事件推送到 dataLayer。 GTM 将能够选择这一点，但您需要创建 2 个用户定义的变量 virtualPageTitle 和 virtualPageURL。触发器将是 VirtualPageview。

希望这能为您澄清问题。