Nuxt2 中添加 google 统计 tag需要增加的东西，谷歌广告投放团队提供第一点 Google tag (gt

需要增加的东西，谷歌广告投放团队提供

<!-- 1. 以下是此账号的 Google 代码。请将该代码复制并粘贴到您网站上每个网页的代码中，紧跟在 <head> 元素之后。-->

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

  gtag('config', 'G-5GTJKSX5SV');
</script>

<!-- 2. 复制下面的代码并将其粘贴到您网站的每个网页上。将此代码粘贴到网页的 <head> 中尽可能靠上的位置。-->

<!-- Google Tag Manager -->
<script>(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-NGXPPPZ7');</script>
<!-- End Google Tag Manager -->

<!-- 3. 请将此代码粘帖到紧跟起始 <body> 标记之后的位置：-->

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

第一点 Google tag (gtag.js)

在nuxt.config.js新增

export default {
  head: {
    script: [
      { src: '/js/initScript.js' },
      { src: 'https://www.googletagmanager.com/gtag/js?id=G-5GTJKSX5SV', async: 'async' }
    ],
  }
}

第二点 Google Tag Manager

在initScript.js中新增

(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-NGXPPPZ7');

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

gtag('config', 'G-5GTJKSX5SV');

第三点 Google Tag Manager (noscript)

因为Nuxt2是SSR的不是SPA，没有公共HTML和APP入口文件，我在 layout 的mounted中插入dom的方式新增noscript标签，可能有更好的方式，若有请大佬们在评论区指导下哈

// 文件 `/layout/default.vue`
  mounted() {
    let noscriptDom = document.createElement('noscript')
    noscriptDom.innerHTML = `<iframe
      src="https://www.googletagmanager.com/ns.html?id=GTM-NGXPPPZ7"
      height="0"
      width="0"
      style="display: none; visibility: hidden"
    ></iframe>`
    document.body.insertBefore(noscriptDom, document.getElementById('__nuxt'))
  }

⚠ 注意

第三点中 noscript 必须要作为body的下级子元素，不可多层