Question

我正在尝试在使用“React”和“React Router”的网站上为Facebook Pixel提供Google Tag Manage，而该网站不是我的，我无法访问来源。

我正在使用“历史记录更改”触发器并检查某些网址更改。然后，每当用户访问该页面时，我都会使用queryselectors获取一些数据并发送像素事件。

问题是当旧页仍然加载并且javacript queryselector从上一页返回数据时，标签会很早被触发，这会继续所有后续链接点击。

以下是我正在使用的代码：'

  <script>
        var prodIdElement = 
    document.querySelector("span[itemprop=productId]");
        var product_id = prodIdElement.textContent;
        console.log(product_id);
        fbq('track', 'ViewContent', {
            content_type: 'product',
            content_ids: [product_id]
        });
  </script>

Answer 1

我们成功使用＆＃34;历史记录已更改＆＃34;。在我们的页面中，用户可以在几个详细信息页面之间进行分页。我们假设您有一个搜索表单，过滤您的项目然后点击一个项目并导航＆＃34;水平＆＃34;通过这些结果。从详细信息切换到另一个是通过javascript完成的：

history.pushState({}, 'my Detail', "http://foo.bar");

open detailview via JS and paginate to next detailview via JS => 2 history changes

如果您还没有，请在GTM中切换到预览模式，以便在测试页上查看GTM的调试面板。有了它你应该看到所有事件（标记被触发/不被触发，dataLayer变量等等......）。

激活历史监听器的触发器的详细列表（以及更多），你可以在这里找到（感谢Simo）：https://www.simoahava.com/analytics/google-tag-manager-history-listener/

希望对您有所帮助。

如何使用Google跟踪代码管理器更改历史记录？

1 个答案: