Fetch failed when fetching data from localhost despite CORS
Unanswered
Bluethroat posted this in #help-forum
BluethroatOP
Hi, I'm pretty new to nextjs (awesome btw). I'm trying to fetch data (v14.1) from an api, and it fails when done from localhost testing, but it works from anywhere else. In my API I have already added the following headers to the response:
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Headers": "Content-Type",
"Access-Control-Allow-Methods": "GET,POST,OPTIONS,DELETE,PUT"
Can someone point me in the right direction? I really need to use localhost for testing
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Headers": "Content-Type",
"Access-Control-Allow-Methods": "GET,POST,OPTIONS,DELETE,PUT"
Can someone point me in the right direction? I really need to use localhost for testing
3 Replies
Acacia-ants
Hey, are you fetching it from external API or what? I had an issue last time when our application was fine locally but on production it failed in Server Actions. Reason? Application on prod is on IIS, so we have rewrite there to localhost:3000. So calling server action with fetch to external api on different server (for example our app is on ourapplication.com/cms and calling oursecondapplication/api) caused cors problems (x-forwarded-host in our app). If it's same for you, look for https://nextjs.org/docs/app/api-reference/next-config-js/serverActions#allowedorigins
BluethroatOP
The API I'm calling is external. It's a Laravel api
But I already set thos headers mentioned in my question