如何在Shiny应用中正确集成新版Google Analytics跟踪代码？

我来帮你搞定这个问题，之前给Shiny应用迁移到新版GA时也踩过类似的坑，下面是两种亲测有效的集成方式：

方法一：直接用tags$head() + HTML()嵌入完整代码 #

这种方式和你之前用旧版GA代码的逻辑一致，直接把新版gtag代码原封不动放到HTML()函数里即可，注意字符串的引号转义：

shinyUI(fluidPage(
  tags$head(HTML(
    "<!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src='https://www.googletagmanager.com/gtag/js?id=XXXXX'></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', 'XXXXX');
    </script>"
  )),
  # 你的其他UI组件代码...
))

这里用双引号包裹整个HTML内容，内部的单引号无需转义，代码会更清晰易读。

方法二：拆分外部脚本与初始化代码（更符合Shiny资源管理规范） #

如果你想按官方文档用includeScript()，需要注意新版GA代码包含两部分：外部脚本加载和本地初始化逻辑，不能混在一起处理：

1. 新建gtag-init.js文件，只放纯初始化JS代码（不要任何<script>标签）：

window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'XXXXX');

2. 在ui.R里分别处理外部脚本和本地初始化代码：

shinyUI(fluidPage(
  tags$head(
    # 引入Google官方的gtag.js脚本
    tags$script(async = NA, src = "https://www.googletagmanager.com/gtag/js?id=XXXXX"),
    # 引入本地的初始化脚本
    includeScript("gtag-init.js")
  ),
  # 你的其他UI组件代码...
))

为什么之前的方法失败？ #

你遇到的问题大概率是这两个原因之一：

• 把包含<script>标签的代码直接放进了.js文件，includeScript()会再包裹一层<script>标签，导致浏览器无法解析嵌套的脚本标签；
• 只放了初始化代码，没有单独引入外部的gtag.js脚本，导致初始化逻辑找不到gtag函数。

验证集成是否成功 #

运行Shiny应用后，打开浏览器开发者工具（F12）：

• 进入Console标签，输入gtag，如果返回函数定义，说明加载正常；
• 进入Network标签，搜索gtag.js，能看到成功加载的请求。

内容的提问来源于stack exchange，提问作者fugu