Nuxt•2mo ago

Cloudflare Pages analytics not recording activity.

I have enabled Cloudflare web analytics for my Nuxt SPA on Cloudflare pages but unlike my other pages sites my Nuxt site is not recording activity. My domain / DNS is hosted on Cloudflare and proxied so any script should be automatically injected. Any help or ideas would be appreciated

2 Replies

kapa.ai•2mo ago

Hi @Mark. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- To address your issue with Cloudflare Web Analytics not recording activity for your Nuxt SPA on Cloudflare Pages, I can provide some suggestions based on the available information: 1. Ensure correct implementation: Make sure you've correctly implemented Cloudflare Web Analytics in your Nuxt app. You can use the useScriptCloudflareWebAnalytics composable to load the analytics script. Here's an example of how to do this in your app.vue:

<script setup lang="ts">
useScriptCloudflareWebAnalytics({
  token: 'YOUR_TOKEN_HERE',
  scriptOptions: {
    trigger: 'onNuxtReady'
  }
})
</script>

<script setup lang="ts">
useScriptCloudflareWebAnalytics({
  token: 'YOUR_TOKEN_HERE',
  scriptOptions: {
    trigger: 'onNuxtReady'
  }
})
</script>

Replace 'YOUR_TOKEN_HERE' with your actual Cloudflare Web Analytics token Cloudflare Web Analytics Example (https://scripts.nuxt.com/scripts/analytics/cloudflare-web-analytics#example). 2. Enable SPA tracking: Cloudflare Web Analytics has a specific option for Single Page Applications (SPAs). Make sure this is enabled:

useScriptCloudflareWebAnalytics({
  token: 'YOUR_TOKEN_HERE',
  spa: true
})

useScriptCloudflareWebAnalytics({
  token: 'YOUR_TOKEN_HERE',
  spa: true
})

The spa option is set to true by default, but it's worth double-checking Cloudflare Web Analytics Input (https://scripts.nuxt.com/scripts/analytics/cloudflare-web-analytics#usescriptcloudflarewebanalytics). 3. Verify script loading: You can check if the Cloudflare Web Analytics script is loading correctly by looking for the __cfBeacon object in the global scope. You can do this by awaiting the script:

const { onLoaded } = useScriptCloudflareWebAnalytics({
  token: 'YOUR_TOKEN_HERE'
})
onLoaded(({ cfBeacon }) => {
  console.log(cfBeacon)
})

const { onLoaded } = useScriptCloudflareWebAnalytics({
  token: 'YOUR_TOKEN_HERE'
})
onLoaded(({ cfBeacon }) => {
  console.log(cfBeacon)
})

This will log the __cfBeacon object to the console if the script loads successfully Cloudflare Web Analytics Example (https://scripts.nuxt.com/scripts/analytics/cloudflare-web-analytics#example). 4. Check for conflicts: Ensure that there are no conflicts with other analytics or script-blocking tools that might be preventing Cloudflare Web Analytics from functioning properly. 5. Verify token and setup: Double-check that you're using the correct token and that the Cloudflare Web Analytics is properly set up for your domain in the Cloudflare dashboard. If you've verified all these points and are still experiencing issues, you may need to contact Cloudflare support for further assistance, as the problem could be on their end or require more specific troubleshooting. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2mo ago

<@472840067342139393> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Gaming

Programming

Cloudflare Pages analytics not recording activity.