Google analytics 在nuxt.js中设置Google Analytics 4

Google analytics 在nuxt.js中设置Google Analytics 4,google-analytics,nuxt.js,google-analytics-4,Google Analytics,Nuxt.js,Google Analytics 4,我在Nuxt上设置新的Google Analytics 4(GA4)帐户时遇到问题。基于教程,所有配置似乎都正常,但是我的流量没有显示在GA中(开发和生产) 在nuxt.config.js中,我有以下内容 buildModules: [ '@nuxtjs/tailwindcss','@nuxtjs/google-analytics' ], googleAnalytics: { id: 'G-HWW3B1GM6W' }, 谷歌id是我的生产网站的GA4数据流id。

我在Nuxt上设置新的Google Analytics 4(GA4)帐户时遇到问题。基于教程,所有配置似乎都正常,但是我的流量没有显示在GA中(开发和生产)

在nuxt.config.js中,我有以下内容

  buildModules: [
    '@nuxtjs/tailwindcss','@nuxtjs/google-analytics'
  ],
  googleAnalytics: {
    id: 'G-HWW3B1GM6W'
  },

谷歌id是我的生产网站的GA4数据流id。我尝试了两种不同的流,有www和没有www,但流量没有显示在GA4中。

[UPDATE]

如果您想使用GA4属性(即ID格式为G-XXXXXXXXX的属性),您可以通过创建插件来尝试使用软件包:

import Vue from 'vue'
import VueGtag from 'vue-gtag'

Vue.use(VueGtag, {
  config: { id: 'G-XXXXXXXXXX' }
})
将其添加到nuxtconfig.js中

plugins: ['@/plugins/gtag']
plugins: ['@/plugins/gtag']

关于您的消息中指出的问题,您提到的插件与Google Analytics的通用版本(即ID格式为
UA-XXXXXXXX-X
)配合使用,如链接中的示例:

 buildModules: [
   '@nuxtjs/tailwindcss','@nuxtjs/google-analytics'
 ],
 googleAnalytics: {
   id: 'UA-XXXXXXXX-X'
 },
您在示例中输入的代码是G-HWW3B1GM6W,它指的是新的Google Analytics 4,它与以前的系统不同,并且(目前)无法使用该插件

因此,我建议您创建一个Universal Analytics类型属性,并将其ID(UA-XXXXX-X)与您指定的插件一起使用。通过单击
显示高级选项
(创建新属性时)可以找到它:


您可以通过创建插件来使用
vue gtag

import Vue from 'vue'
import VueGtag from 'vue-gtag'

Vue.use(VueGtag, {
  config: { id: 'G-XXXXXXXXXX' }
})
记住在nuxtconfig.js中添加它

plugins: ['@/plugins/gtag']
plugins: ['@/plugins/gtag']

我来这里是因为我在开发或生产模式时在GA方面没有任何结果

您需要做的第一件事是为您要测试的网站禁用任何广告拦截器或反跟踪器

其次,您需要处于生产模式(
npm运行构建
,然后
npm启动

如果您希望处于开发模式,并且仍然在GA中获得结果,请在nuxt.config.js内的GA配置中传递
debug:{sendHitTask:true}

publicRuntimeConfig: {
    googleAnalytics: {
      id: process.env.GOOGLE_ANALYTICS_ID,
      debug: {
        sendHitTask: true
      }
    }
 },

非常感谢。别忘了禁用localhostHi上的标记!您知道这样安装是否允许路线跟踪吗?谢谢