怎么让Google Analytics GA4识别我的带有VUE-gtag的Nuxt网站?

本教程将介绍如何让Google Analytics GA4识别我的带有VUE-gtag的Nuxt网站?的处理方法,这篇教程是从别的地方看到的,然后加了一些国外程序员的疑问与解答,希望能对你有所帮助,好了,下面开始学习吧。

怎么让Google Analytics GA4识别我的带有VUE-gtag的Nuxt网站? 教程 第1张

问题描述

我有一个要使用Google Analytics跟踪的Nuxt.jsWeb客户端。
我这样使用vue-gtag:

/plugins/vue-gtag.js

import Vue from 'vue'
import VueGtag from 'vue-gtag'
export default ({ app }) => {
  Vue.use(
 VueGtag,
 {
config: { id: process.env.GTAG }, // this is defined in my Netlify env variables together with my backend API which works
appName: 'SleepRescue',
bootstrap: true,
enabled: true,
pageTrackerScreenviewEnabled: true,
 },
 app.router
  )
}

nuxt.config.js

plugins: [
  ...
  { src: '~/plugins/vue-gtag' },
  ...
]

我还定义了自定义事件,如下所示:

async registerUser() {
  this.$gtag.event('sign_up', {
 event_category: 'engagement',
 event_label: 'method',
  })
  ...
}

请随时查看plugin、我的Nuxt config和给定的example of a custom tag。

不幸的是,我的Google Analytics仪表板无法识别任何流量,似乎也无法识别我定义的任何标记。我已经尝试从多台机器和IP访问我的网站,但仍然没有流量。如果我进入GA帐户->Admin->数据流,我可以在"网站&下看到我的网站,但它显示"在过去48小时内未收到数据"。如果我单击它,那么我将能够看到G-*ID作为测量ID,我认为只要它与我的VueGtag ID中的匹配,它就应该可以工作。

有人知道这里可能出了什么问题吗?

推荐答案

以下是GA3和GA4的区别列表:https://cxl.com/blog/ga4/
不确定仍然使用GA3是否会破坏交易。

选中可能完全支持GA4的this solution。

另外,如果你不是Google的铁杆粉丝,想使用更开源的东西,你可以查看Plausible,甚至可以试试Debbie的detailed setup here。

好了关于怎么让Google Analytics GA4识别我的带有VUE-gtag的Nuxt网站?的教程就到这里就结束了,希望趣模板源码网找到的这篇技术文章能帮助到大家,更多技术教程可以在站内搜索。