Nuxt•4mo ago

How to fetch properly ?

Hello, i recently tried to fetch informations with my backend (AdonisJs) with multiple methods in the documentation. But nothing works, i tried : useFetch and useAsyncData, combined with $fetch like in the documentation. My application is an SSR app (i think 😅), and i try to fetch simple informations to display on my website with this api : https://api.tnptrading.fr/home

4 Replies

Cue•4mo ago

Could you shed more light on what you’ve tried? How are you using useFetch? Any code examples? Maybe a simple reproduction? (see https://nuxt.new)

plr.OP•4mo ago

Yes ofc :

<script setup lang="ts">
let { data, status } = await useFetch('https://api.tnptrading.fr/home')
</script>

<template>
  <div v-if="status == 'pending'">Chargement...</div>
  <div v-else-if="status == 'error'">Erreur : {{ error }}</div>
  <p v-else>{{ data }}</p>
</template>

<script setup lang="ts">
let { data, status } = await useFetch('https://api.tnptrading.fr/home')
</script>

<template>
  <div v-if="status == 'pending'">Chargement...</div>
  <div v-else-if="status == 'error'">Erreur : {{ error }}</div>
  <p v-else>{{ data }}</p>
</template>

That's my Numbers.vue file When i remove "await", it works, but only when i reload with hmr update

Mike•4mo ago

Looks like there's an ssl error on that site. Try fetching https://httpbin.org/get to see if that works

plr.OP•4mo ago

Ohhh thx it was the SSL error I hadn't seen on my api ! thanks a lot

Gaming

Programming

How to fetch properly ?