CODEWITHSUNDEEP
nuxt.jsvitestrapinuxt3.jsnitro
noel293
noel293

Reputation: 504

Nuxt3 - Local Server/api Calls don't work

I am trying to get some data from my Stapi CMS through the API but I am getting an error.

in my useGetData.ts composable I am making a call to the server/api/get-data. I am getting back a 500 error [GET] "http://localhost:1337/api/hello-world?locale=es-ES&populate=*": <no response> fetch failed.

Calling the api from postman works ok. the api key and endpoints are correct. It is worth mentioning that if I change the enpoint from the local CMS to the one on the server everything works ok.

Does the server/api have issues when calling APIs that run locally?

useGetData.ts

 const {data, seo} = await $fetch('/api/strapi/retrieve-data', {
                method: 'POST',
                body: {locale: iso, collection: collection},
            })

server/api/get-data

 const data = await $fetch(`${strapiURL}/api/${body.collection}`, {
        method: "GET",
        headers: {
            "Authorization": `Bearer ${strapiToken}`
        },
        query: {locale: body.locale, populate: '*'}
    });

Upvotes: 0

Views: 187

Answers (2)

khaleel
khaleel

Reputation: 1

Replace localhost with 127.0.0.1.

For example, http://127.0.0.1:1337/api/hello-world?locale=es-ES&populate=* by changing strapiURL from http://localhost:1337 to http://127.0.0.1:1337.

Apparently, it's a Node >17 feature that affects $fetch. Read more here: https://github.com/nuxt/nuxt/issues/12358.

Upvotes: 0

noel293
noel293

Reputation: 504

After a lot of debugging I found out that the reason it wasn't working is because the CMS was running locally under windows and my project was running under WSL

Upvotes: 0

Related Questions