使用 nextjs 13 的 Google 分析?

问题描述 投票:0回答:2

有没有人成功地让谷歌分析在 NextJS 13 上工作?

我关注了这个主题:How to implement Google Analytics with NextJS 13? 但是当我在我的应用程序上做同样的事情时,Google Analytics 上没有任何显示。我在应用程序中也没有收到任何错误,当我检查页面时脚本加载正确。

我想在上面的那个线程中发表评论,但我没有足够的声誉:/

javascript next.js google-analytics nextjs13
2个回答
0
投票

就我而言,最简单的方法是将它添加到标头内的元标记中。为此,您需要一个可以在谷歌控制台中获得的验证密钥。请使用 Nextjs

<Head />
并在那里添加元标记,如下所示:

// pages/index.tsx

import Head from "next/head";
...
<Head>
     <meta name="google-site-verification" content="your verification key" />
</Head> 
...

部署后,你必须去你的谷歌控制台检查它是否有效。

您可以尝试的另一种方法是使用 Firebase 库对事件进行更多控制https://firebase.google.com/docs/analytics/get-started?platform=web.


0
投票

你最好的做法是使用Google提供的脚本和Next提供的

Script
组件。请参阅官方文档中的此处

export default function _App({ Component, pageProps }){
    return <>
            {/* Page component */}
            <Component {...pageProps} />    

            {/* Google analytics. */}
            <Script src="https://www.googletagmanager.com/gtag/js?id=YOUR_TOKEN" strategy="afterInteractive" />
            <Script id="google-analytics" strategy="afterInteractive">
                {`
                    window.dataLayer = window.dataLayer || [];
                    function gtag(){dataLayer.push(arguments);}
                    gtag('js', new Date());
                    gtag('config', 'YOUR_TOKEN');
                `}
            </Script>
    </>;
}
© www.soinside.com 2019 - 2024. All rights reserved.