useAsyncData dual call issue. One in the client side and server side?
Hi everyone,
We're trying to implement SSR in Nuxt 3 without making API calls on the client side. This worked fine in Nuxt 2, but in Nuxt 3, when navigating to a page, the useAsyncData function still triggers an API call. Is there a way to prevent this and enforce blocking navigation like we had in Nuxt 2? Any advice would be appreciated!
2 Replies
consider showing code?
Here is my home page:
<script setup lang="ts">
import { metaDesc } from '~/utils/seo'
const nuxtApp = useNuxtApp()
const { data: pageData } = await useAsyncData('homepage', () => useCmsPageQuery('/'), {
getCachedData(key) {
return nuxtApp.payload.data[key] || nuxtApp.static.data[key]
}
})
useHead(metaDesc(pageData?.value?.data?.seo))
</script>
not sure on we can fix thi. On nuxt 2 I remember the asyncData will do server side rendering, but on nuxt 3 its calling the API in the client side and server side