vue.js 在每个页面/路线的正文标签中再添加GTM(noscript)

daolsyd0 于 2022-11-25 发布在 Vue.js

关注(0)|答案(3)|浏览(539)

我试图在一个Nuxt应用上实现Google Tag Manager，但在如何将noscript标记添加到打开body标记内的每个页面/路径上的应用上遇到了麻烦。我尝试创建一个静态脚本，并通过nuxt config添加文件：

{ src: "/scripts/gtm.js", body: true }

它将文件添加到正文中，但由于gtm中的noscript标记和嵌套iframe而引发错误。不确定是否有更好的方法将实际脚本直接注入正文中

<!-- Google Tag Manager (noscript) -->
<noscript><iframe
src="https://www.googletagmanager.com/ns.html?id=GT
M-4BXKY65"
height="0" width="0"
style="display:none;visibility:hidden"></iframe></n
oscript>
<!-- End Google Tag Manager (noscript) -->

vue.js

来源：https://stackoverflow.com/questions/70173603/nuxt-add-gtm-noscript-to-body-tag-on-every-page-route

3条答案

按热度按时间

zzlelutf1#

艾凯说得对。Noscript在99.99%的情况下完全没用。它只在用户关闭JS时使用，但与你想象的不同，它不会让GTM在没有JS的情况下工作。事实上，只有一个标签会在那种状态下“激发”，那就是很少使用的自定义图像标签。
是的，noscript意味着一个iframe，如果你的应用不支持它们，那么就没有noscript了。真的，Nuxt是一个前端渲染框架。为什么你的<noscript>中除了要求用户启用JS才能看到网站之外还有其他东西呢...

赞(0）回复(0）举报 2022-11-25

2admgd592#

nuxt.config.js中的head property可以让你定义每个页面上出现的所有 meta数据和脚本，看起来你可以根据需要添加一个noscript部分。

赞(0）回复(0）举报 2022-11-25

ie3xauqp3#

这适用于Nuxt v2。
我通过layouts/default.vue添加了noscript GTM代码。这样做会将它插入到body中，尽管没有完全插入到最后（这可能很好）。
在测试实现时，让我有点困惑的是：
当我打开JavaScript时，我在Chrome开发工具中看到了以下内容：