标签: google-tag-manager
使用 Google 跟踪代码管理器和 Google Analytics 来跟踪 Chrome 扩展程序 (2020)
我正在开发一个 Chrome 扩展，我希望能够使用谷歌分析来跟踪指标。我相信最简单的方法是通过标签管理器，并且我发现本教程解释了如何在 Chrome 扩展中实现谷歌标签管理器。但是，仅遵循本教程对我来说不起作用，我有几个问题。
\n- \n
- 是否可以使用 Google Analytics 跟踪 Chrome 扩展程序？如果是这样，我只看过使用Universal Analytics的教程，但是可以使用Google Analytics 4吗？建议现在就开始使用 GA4，如果可能的话我也愿意这样做。 \n
- 我将如何设置数据流？Web 数据流需要有效的 URL，这并不真正适用于扩展程序。我正在开发一个单独的网站，我可以包含该 URL，但我的目标是跟踪扩展程序，而不是网站。 \n
- 在 GTM 中调试时，现在要求您添加要调试的 URL。我的扩展程序在 amazon.com 上运行，但是当我输入 amazon.com 作为 URL 时，我收到 404，可能是因为跟踪代码实际上并不适用于 amazon，而是适用于我打开时注入的 iframe亚马逊。我会在这里做什么？ \n
我已将其设置为使 GTM 代码位于单独的 js 文件中，该文件被注入到 head 标记末尾的 iframe html 代码中。我已经修改了清单中的 CSP，以允许向 google 分析和 google 标签管理器发出请求。在 GTM 中构建标签时，我将字段设置checkProtocolTask为false、page自定义 url 和pathto ，{{Page Path}}如上面的教程和这个 SO 问题所建议的那样。现在我已经使用 GA4 设置了 GA 帐户，并且正在使用网络数据流。我将 GTM …
javascript google-analytics google-chrome-extension google-tag-manager google-analytics-4
推荐指数
解决办法
查看次数
Google Analytics 4 事件参数
我们的网站上有通过 GTM 运行的 GA4 增强型电子商务。我们正在跟踪 Google 文档中提到的所有事件（例如 add_to_cart、begin_checkout、view_item_list）。
对于“ view_item_list ”、“ begin_checkout ”和“ purchase ”等事件，我们可以在“Realtime”和 GA DebugView 中看到它们（它们甚至显示“Items”选项卡，其中包含这些事件中的所有项目），并且我们的 dataLayer 具有没有问题：
但是，当我们尝试在“参与”>“事件”>“view_item_list”（例如）中查看任何此类数据时，显示的唯一数据是标准事件计数：
从屏幕截图中可以看到，“view_item_list”没有参数。我们不确定如何获取要显示的实际数据，例如“item_name”或“item_list_name”。
任何帮助深表感谢。
谢谢！
编辑：
我们现在已添加这些项目范围的参数作为自定义维度：
然而，自我们添加这些以来已经超过 36 小时了，其中一些维度/参数已经生成了卡片，但“Items”参数没有生成任何内容。
仍然非常感谢任何帮助。谢谢。
推荐指数
解决办法
查看次数
根据开发环境分离 Google Analytics 数据
因此，我发现了一些类似的问题，但通常要么过时，不完全是我正在搜索的内容，要么他们不使用 Google 标签管理器，而是将标签写入<head>.
- - - - - -现在的情况- - - - - -
我们使用 Google 标签管理器在我们的网站上注入 Google Analytics 等标签。我们根据需要发生的情况使用多个标签；例如：
- 跟踪页面
- 跟踪特定点击
- 跟踪登录或注册事件
所有数据都完美地传输至 Google Analytics
- - - - - -问题- - - - - -
但是，我们还从其他环境（例如localhost:3000或 ）接收数据https://dev.ourdomain.com，这可能会导致数据不准确。
-----------我们想要的-----------
是一种分离数据的方法。通过以下任一方式：
- 将 Google Analytics 中的数据与生产（域 A）和开发中的数据（其他域）分开
- 在数据到达 Google Analytics 之前将其分离（就像我下面的建议）
- 或者也许还有其他建议
在第 1 点和第 2 点之间，我更喜欢第一种方式，因为这会将现有数据分为生产数据和开发数据。
-----------建议的解决方案-----------
我一直在考虑使用新的属性，然后使用 Google 跟踪代码管理器，我将根据当前域返回 Google Analytics 设置。生产才会回归UA-code-1、发展UA-code-2 …
development-environment google-analytics production-environment google-tag-manager
推荐指数
解决办法
查看次数
同一页面上有多个 Google Analytics gtag 跟踪 ID
我的 Google Analytics（分析）帐户中有两个针对同一网站的财产跟踪 ID。我基本上希望将相同的数据集插入到两个属性/视图中。目前，我在网站上的设置方式如下：
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXXX-1');
gtag('config', 'UA-XXXXXXXX-3');
</script>
然而，我开始意识到这实际上并不能正常工作。我相信正确的解决方案是这样的（两组脚本标签，每个属性一组），但我不是 100% 确定：
<!-- Global site tag (gtag.js) 1 - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXXX-1');
</script>
<!-- Global site tag (gtag.js) 2 - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX-3"></script>
<script>
window.dataLayer = window.dataLayer || …推荐指数
解决办法
查看次数
如何将 Google 标签管理器与 React 应用程序集成？
该项目的技术规范是 ExpressJS 和 ReactJS。
这用作浏览器扩展。
我正在使用“react-gtm-module”来实现 Google 跟踪代码管理器。
import React, { Component } from "react";
import "./App.css";
import "bootstrap/dist/css/bootstrap.min.css";
import Landingpage from "./components/Landingpage.js";
import Landingpagetest from "./components/Landingpagetest.js";
import Ad from "./components/Ad.js";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import TagManager from 'react-gtm-module';
import Referral from "./components/Referral";
import OnInstall from "./components/OnInstall";
const tagManagerArgs = {
gtmId: 'GTM-P5Q5Q84'
}
TagManager.initialize(tagManagerArgs)
class App extends Component {
render() {
return (
<Router>
<Switch>
<Route exact path="/"></Route>
<Route path="/tabbing" component={Landingpage} />
<Route …推荐指数
解决办法
查看次数
我可以向 GA4 中的“项目”添加自定义参数吗？
我正在使用 GA4，我想在某些事件中向“items”参数添加一些自定义参数。
阅读文档后，我发现此参考文献中有这样的观察：“项目参数最多可以有 10 个自定义参数。” 。参考：https://developers.google.com/analytics/devguides/collection/protocol/ga4/sending-events ?client_type=gtag#limitations
我在文档中没有找到一些如何在“items”中使用自定义参数的示例。
当我尝试将一些自定义参数传递到“items”时，GA4 GTM 模板标记构建的请求在查询字符串参数中具有以下格式：
pr1: id24~nmexampleName~pr12345~lnlistName~k0customKey00~v0customValue00~k1customKey01~v1customValue01
但是，我还没有在 BigQuery 中找到此自定义键和值信息。
有没有办法在“items”中使用自定义参数，然后在 BigQuery 上使用此数据？
google-analytics google-analytics-api google-bigquery google-tag-manager google-analytics-4
推荐指数
解决办法
查看次数
CSP 随机数实现是什么样的？
我最近一直在阅读 CSP 的内容，但我未能找到关于 nonce 如何工作的清晰解释或可靠示例。unsafe-inline出于安全考虑，我试图避免使用。
到目前为止，我的理解如下：
服务器每次连接都会生成一个新的随机数客户端通过某种方式获取这个随机数并将这个字符串插入到每个脚本标签中
但是，我不知道客户端如何获得这个在每个连接中都是动态且唯一的值。某种方式是什么样的？我应该实现一个额外的 API 来获取这个值吗？
我使用了 React.js，并且我的 HTML 头中有一个Google 跟踪代码管理器片段，如果有人可以提供与这些相关的示例，那就完美了。
http-headers nonce content-security-policy google-tag-manager reactjs
推荐指数
解决办法
查看次数
是否可以在 Google Analytics 中指定网站的应用程序版本？
有一个单页应用程序（网站）无需更新（包括本地副本）即可执行其功能。它已连接（通过 Google 标签管理器）Google Analytics，我获取有关应用程序功能使用情况的数据（通过按钮点击触发）。但在GA中，“应用程序版本”在所有报告中都显示为“（未设置）”。
是否可以以某种方式从网站传递应用程序的版本，或者此功能仅适用于应用程序？
更新：
这是GA4。
不幸的是，我尝试在 GTM 中通过“要设置的字段”进行此操作，但失败了。现在我可以在实时报告中看到 appVersion 作为事件“page_view”或我的自定义事件的参数，但在常规报告中应用程序版本仍然标记为“(not_set)”。
推荐指数
解决办法
查看次数
如何为多个 GTM 环境（开发、生产）设置 Google Analytics 4
我需要解决方案来为我的具有多个 GTM 环境（开发、生产）的网站设置 Google Analytics4。
早些时候，对于 Universal Analytics，我们通过设置查找表和跟踪 ID（针对多个环境）解决了这个问题
到目前为止配置：
- 为（开发和产品）创建属性 n 在 Google Analytics 中设置数据流（产品和开发域）
- 在 GTM 中为开发和生产创建自定义环境
- 使用测量 ID（产品）设置 Google Analytics 4 配置标记
- 添加了（开发和生产）的 GTM 环境代码片段
我们可以在 GA 报告中看到开发和生产数据。这弄乱了整个报告。因此，我们需要将产品数据转发到 GA Prod 属性 n Dev 数据 Dev 属性。
推荐指数
解决办法
查看次数
在应用程序完全加载后，如何将 Google 跟踪代码管理器加载到 next.js 应用程序？
我正在构建一个 next.js 应用程序，并且希望仅在加载整个页面后才加载 Google 跟踪代码管理器 (GTM)。其背后的目标是提高网站性能。
有没有人想出一种方法，让我可以在应用程序完全加载后运行第三方 JS 代码（如 GTM）？
我目前正在添加使用“传统”方式将 GTM 注入到我的 next.js 应用程序（源代码）中，方法是将<script>标签添加到文件中的标签中<Head>，并将<noscript>标签添加到文件<body>中的标签中_document.js：
<Head>
{/* Google Tag Manager */}
<script
dangerouslySetInnerHTML={{
__html: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');`
}}
/>
{/* End Google Tag Manager */}
...
...
</Head>
<body style={{ backgroundColor: theme.palette.primary.background }}>
{/* Google Tag Manager (noscript) */}
<noscript
dangerouslySetInnerHTML={{
__html: '<iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe>'
}}
/>
{/* End Google Tag Manager …javascript dynamic-import google-tag-manager reactjs next.js
推荐指数
解决办法
查看次数