history.pushState 似乎导致 gtag.js 再次加载（SPA）答案

【问题标题】：history.pushState seems to cause gtag.js to load again (SPA)history.pushState 似乎导致 gtag.js 再次加载（SPA）
【发布时间】：2023-03-24 20:19:02
【问题描述】：

每次我更改页面时，我的 SPA 都会重新加载 GTAG。网上的每个帖子都说我必须让 GTAG 在我的代码中再次加载。所以，我整理了一个小的粗略样本来重新创建这个问题。我在做什么导致多重负载？我只注意到它，因为 Chrome 中的 Google Tag Assistant 扩展指出“检测到多个安装的全局站点标记 (gtag.js)”。一切似乎都被很好地跟踪了。

<html>
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_MEASUREMENT_ID', {'send_page_view': true});
</script>

<title>Single Page</title>
<script>
function change_page_function(page_nm)
{
    var page = {'page':page_nm};
    history.pushState(page, page_nm, '/'+page_nm);
    gtag('event', 'page_view', {'page_title' : page_nm, 'page_path' : "/"+page_nm});
    //gtag('config', 'GA_MEASUREMENT_ID', {'page_path': page_nm});
}
</script>
</head>
<body>
    <a onclick="change_page_function('One');return false;" href="javascript:void(0);">Page 1</a>
    <a onclick="change_page_function('Two');return false;" href="javascript:void(0);">Page 2</a>
</body>
</html>

在我真正的 SPA 中，如果我删除了 history.pushState，它不会加载多个 gtag.js 标签，它的行为和跟踪都很好。当然减去漂亮的网址。我还尝试恢复到通用分析并遇到了同样的问题。如果我将 GTM 添加到此示例中，它也会重复。

【问题讨论】：

标签： javascript google-analytics pushstate gtag.js

【解决方案1】：

问题在于 Google Tag Assistant 与单页应用程序一起使用时。至少在我的情况下。我会说通过查看开发人员控制台中的“网络”选项卡，确保您没有加载 gtag.js 或 js 两次。 https://www.analyticsmania.com/post/multiple-installations-of-google-tag-manager-detected/

【讨论】：

如果您明确解释为什么/如何使用带有 SPA 的 Google Tag Assistant 会出现问题，这会更好。从这个答案中不清楚是什么导致您多次加载 gtag.js 。另请注意，如果问题实际上无法从您问题中的信息中识别出来，那么您应该更新您的问题以包含足够的信息来识别实际问题。在您正在使用哪个 SPA 框架的问题中说出来可能会有所帮助，因为从 SPA 中的每次导航时重新加载 <head> 的问题中不清楚。