如何在 React JS 應用程序中使用 Google Analytics 代碼？

Question

我想在腳本標簽中的 react JS 應用程序中使用以下 Google Analytics 代碼。

當我將以下代碼放入 Helmet 時，我顯示語法錯誤？

我該如何使用它？

<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-Code");
</script>
<!--  End Google Tag Manager  -->
<!-- Makes it possible to add onclick attribute to buttons and such -->
<script>
  window.onload = function () {
    var anchors = document.getElementsByTagName("*");
    for (var i = 0; i < anchors.length; i++) {
      var anchor = anchors[i];
      anchor.onclick = function () {
        code = this.getAttribute("whenClicked");
        eval(code);
      };
    }
  };
</script>

Answer 1

只需執行以下兩個步驟，復制下面的代碼並將其粘貼到測試環境的每個頁面上。 將此代碼粘貼到頁面頂部盡可能高的位置：

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

此外，在開始的正文標記之后立即粘貼此代碼：

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

根據提供的源代碼，您沒有在 body 標記后添加 noscript 標記。

請提供確切的錯誤，以便您更好地了解該問題。

Answer 2

您可以嘗試使用為您處理腳本注入的 3rd 方庫，例如React GA 。