window.gtag 在初始加载后不会触发 GA 调用

时间:2021-07-09 12:22:21

标签: next.js

下面的代码包含如何将谷歌内容导入应用程序。它工作正常并调用 GA,如下图所示。但在路由到后续页面时它不起作用。

如下图所示,它只会在硬刷新页面时调用分析 API...

enter image description here

_app.js:

const ymkApp = ({ Component, pageProps }) => {
  const router = useRouter()

  const handleRouteChange = (url) => {
    console.log(url)
    if (typeof window !== 'undefined') {
      window.gtag('config', 'TRACKID', {
        page_path: 'https://preprod.yemek.com/tarif/kiraz-receli',
      })
    }
  }

  useEffect(() => {
    router.events.on('routeChangeComplete', handleRouteChange)
    return () => {
      router.events.off('routeChangeComplete', handleRouteChange)
    }
  }, [router.events])

  return <Component {...pageProps} />
}

_document.js:

import getConfig from 'next/config';
import Document, { Head, Html, Main, NextScript } from 'next/document';

const { publicRuntimeConfig } = getConfig()

export default class MyDocument extends Document {
  render() {
    return (
      <Html lang="tr">
        <Head>
          {/* Google Tag Manager Start */}

          <link
            rel="dns-prefetch preconnect"
            href="https://www.google-analytics.com"
          />
          <link
            rel="dns-prefetch preconnect"
            href="https://www.googletagmanager.com"
          />

          <script
            async="async"
            src="https://www.googletagservices.com/tag/js/gpt.js"
          />
          <script
            type="text/javascript"
            dangerouslySetInnerHTML={{
              __html: `
                var googletag = googletag || {};
                googletag.cmd = googletag.cmd || [];
              `,
            }}
          />
          <script
            dangerouslySetInnerHTML={{
              __html: `(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', 'TRACKID');`,
            }}
          />
          <noscript
            dangerouslySetInnerHTML={{
              __html: `<iframe src="https://www.googletagmanager.com/ns.html?id=${publicRuntimeConfig.gtm}" height="0" width="0" style="display:none;visibility:hidden"></iframe>`,
            }}
          />
          {/* Google Tag Manager End */}
        </Head>
        <body>
          <Main />

我已经检查过,每次更改时它都会调用 window.gtag,但不会触发调用 GA。这里可能缺少什么?

0 个答案:

没有答案
相关问题