What could go wrong using top-level await useFetch in a page?
=> /pages/index.vue
<script setup>
const { data } = await useFetch('/api/v1/posts');
</script>
=> /server/api/v1/posts/index.ts
export default defineEventHandler(async () => {
const results = await prisma.posts.findMany();
return results;
});
On first page visit I will have null posts. Why is useFetch not blocking page rendering until server has been responded? :/
5 Replies
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Thank you! I think that it has something to do with this: https://nuxt.com/docs/api/composables/use-fetch#return-values
But it is not SEO friendly...
Nuxt
useFetch · Nuxt Composables
This composable provides a convenient wrapper around useAsyncData and $fetch.
@needmorewood any luck with this issue?
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
I managed to find the cause of the issue... it was Basic Auth. Since there was no error message about it anywhere, it was not immediately possible to figure it out.
So yes, the issue is resolved 🙂