标签: google-tag-manager

想知道是否有人可以阐明使用谷歌标签管理器是否符合 PCIDSS？

我知道其中有一些规定可以确保标签不能被注入，例如保护服务器、xss 保护等，但找不到任何关于支持动态 html 更改的标签管理器是否可以的信息。

我可以看到这两个论点...

我正在使用 Google 跟踪代码管理器将页面浏览事件推送到数据层以进行分析跟踪。这种情况发生在componentDidMount()中（如果我正在使用 withRouter 监听 location 属性的查询字符串参数更改，有时会发生在 componentWillReceiveProps()中）。

我正在使用React-helmet在组件更改时动态更新我的标题和其他标签。

我注意到一个问题，即我在 Analytics 中获得的页面标题不正确。它经常显示上一页的页面标题，而不是我当前所在的页面标题。看来react-helmet直到componentDidMount()之后才更新标签之后才更新标签。

页面查看事件函数示例

每次将此事件推送到数据层时，我在 GTM 中的分析标记都会被调用

const firePageViewEvent = () => {
      console.log("Pageview event fired (from tracking script)");

      if (window && window.dataLayer) {
          console.log("window and dataLayer exist, pushing pageview event.");
          let dataLayer = window.dataLayer || [];
          dataLayer.push({
              'event': 'reactPageViewEvent'
          });
      } else {
          console.log("window or dataLater does not exist, cannot push pageview event.");
      }
};

刚学GTM。我想使用 GTM 来使用我命名为“specimen”的 DOM Element 变量来获取元素的文本。该变量当前设置为 CSS 选择器specimen。

触发器是设置为 class 的“单击-所有元素”类型specimen_record_thumbnail。

从下面的 DOM 中可以看出，specimen选择器需要限制为单击的触发器的父级，即specimen_record_container，因为页面将包含许多这样的结构/类。

specimen我应该如何在 DOM Element 变量中定义 CSS 选择器以获取同级选择器的文本specimen_record_thumbnail？

<div class="specimen_record_container">
        <img class="specimen_record_thumbnail" data-specimen="374" src="specimen_media/374/specimen_pk_374_20082014_123312_thumbnail.jpg" border="0">
        <div class="diagnosis" title="<p>Adrenal gland</p>" rel="tooltip">Diagnosis</div>
        <span class="specimen"> T93.M8006<sup>5</sup></span>
    </div>

另外，也许自定义 JavaScript 变量可能会更好......

任何帮助或建议表示赞赏！

更新 - 工作解决方案：感谢 Eike Pierstorff

此代码进入 GTM 自定义 JavaScript 变量以获取父容器倒数第二个子级的文本，然后将其设置为 Universal Analytics 标记的标签：

function () { return {{Click Element}}.parentNode.lastChild.previousSibling.innerText } 

为了缩短我正在开发的 Web 应用程序的初始加载时间，我想在加载应用程序后运行 GTM 脚本。

1. 我想知道这是否是一个好主意？
2. 如果我这样做，可能会产生什么副作用？

我知道这可能看起来有点模糊，但我将提供更多背景信息：在我工作的公司中，我们使用（我个人的想法是我们滥用）Google Tag Manager (GTM)来注入一些第三方GTM 标签内的脚本。大多数情况下，我们使用它来操作某些页面模板（例如产品页面）中的 DOM 并注入第三方脚本（例如 Zopim 聊天、Facebook Pixel 等\xe2\x80\xa6）。

DOMContentLoaded我们通常做的事情是：在页面加载时和/或事件发生时操纵 DOM load，因此对我来说，显然如果没有这些 GTM 标签，我们的网站将在PageSpeed Insights和Chrome DevTools\' Lighthouse中获得更好的分数。如果没有激活 GTM 标签，我无法测试该网站，因为它已经在网站中随处可见。

这种 GTM 的使用对我们网站的速度有多大影响？

我在 GTM 中包含一个自定义脚本，用于调用外部资源。脚本看起来像这样

<script type="text/javascript" id="some-key" data-key="xxxxxxxxxxxxxxxxxx" src="link-to-external-resource"></script>

我已将其触发设置为当前触发正常的所有页面，但问题是，脚本在 DOM 中没有data-key属性的情况下呈现。它在 DOM 中的渲染看起来像这样

<script type="text/javascript" id="some-key" src="link-to-external-resource"></script>

我错过了什么吗？有没有办法在 Google 跟踪代码管理器中包含 data-* 属性？

我正在使用 GTM 并尝试提交购买事件，但是 custom_map 和项目都被发送并报告为 [Object object]。

我一直在关注谷歌的这些官方文档： https: //developers.google.com/analytics/devguides/collection/gtagjs/ecommerce https://developers.google.com/analytics/devguides/collection/gtagjs/custom-dims -mets

这是我的代码：

gtag('config', 'GTM-ID', {
    custom_map: {
        dimension1: 'tenant_name',
        dimension2: 'office_id'
    }
});

gtag('event', 'purchase', {
    transaction_id: 'string',
    value: 12345,
    currency: 'string',
    tenant_name: 'string',
    office_id: 'string',
    items: [
        {
            id: 'string',
            name: 'string',
            price: 12345,
            quantity: 5
        }
    ]
});

当然，示例中的数据是虚拟数据，但结构和数据类型完全相同。查看请求负载，custom_map 和 items 都被编码为 [Object object]。

以下是请求负载：

en=purchase&_et=6&ep.custom_map=%5Bobject%20Object%5D&ep.transaction_id=string&epn.value=12346&ep.tenant_name=string&ep.office_id=string&ep.items=%5Bobject%20Object%5D&cu=string

有任何想法吗？

我正在尝试将 GTM 环境功能与查找表结合使用，并希望将各个环境的数据发送到不同的 Google 分析属性。这可能吗？我们可以使用具有实时和临时环境的单个 GTM 容器并将数据发送到两个不同的 Google Analytics 属性吗？

我在标签模板中使用 Google 跟踪代码管理器中的jectScript API，但我无法让它在外部脚本加载（或加载失败）时触发任何回调函数。有什么想法吗？

因此，我的模板具有定义的注入脚本权限： https: //www.google-analytics.com/analytics.js

代码：

// load APIs
const logToConsole = require('logToConsole');
const injectScript = require('injectScript');
const queryPermission = require('queryPermission');

// script url
const url = 'https://www.google-analytics.com/analytics.js';

// Callback to note if script load succeeded
const onSuccess = () => {
  logToConsole('Script LOADED');
  data.gtmOnSuccess();
};

// Callback to note if script load failed
const onFail = () => {
  logToConsole('Script load FAILED.');
  data.gtmOnFailure();
};

// Check permission and load script
logToConsole('Checking permission to load script:' + url); …

我试图在 React 应用程序中实现 partytown，但 partytown 文档不清楚，我无法找到用于 partytown 实现的良好资源。请通过一个很好的例子来指导如何在 React 中实现 partytown。另外，有什么方法可以检查 partytown 是否已实施