通過使用純Javascript在單頁應用程序上使用Google跟蹤代碼管理器

Question

我正在ReactJS網站上實現Google Tag Manager ReactJS Google Tag Manager 。

為此，我從Google文檔獲得以下說明：

參考： https : //developers.google.com/tag-manager/quickstart

復制以下JavaScript，並將其粘貼到您網站的每個頁面上盡可能靠近開始標記的位置，並用您的容器ID替換GTM-XXXX ：

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

復制以下代碼段，並將其粘貼到網站每個頁面上的開始標記之后，然后將GTM-XXXX替換為您的容器ID：

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

我的問題是我的ReactJS網站上有很多頁面都可以更改，而無需刷新瀏覽器。 我的意思是，這是一個Single Page App （ SPA ），僅加載一次，之后用戶可以瀏覽該SPA的頁面而無需刷新瀏覽器。

我只想跟蹤一頁： /thank-you 。

什么是實現這一目標的最佳方法。 我已經進行了很多研究，但沒有找到使用普通Javascript進行此操作的方法。

任何代碼段都將受到歡迎。

謝謝！

Answer 1

您可以使用“歷史記錄更改”觸發器來跟蹤SPA。 這是GTM幫助頁面上的基本說明 。 這使GTM可以捕獲React Application的位置更新。

然而，你可能會發現一些有用的指南像這樣