有没有人成功地让谷歌分析在 NextJS 13 上工作?
我关注了这个主题:How to implement Google Analytics with NextJS 13? 但是当我在我的应用程序上做同样的事情时,Google Analytics 上没有任何显示。我在应用程序中也没有收到任何错误,当我检查页面时脚本加载正确。
我想在上面的那个线程中发表评论,但我没有足够的声誉:/
就我而言,最简单的方法是将它添加到标头内的元标记中。为此,您需要一个可以在谷歌控制台中获得的验证密钥。请使用 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.
你最好的做法是使用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>
</>;
}