NextResponse.redirect not working as expected
Answered
American black bear posted this in #help-forum
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
Hello everyone,
I'm encountering an issue with redirection using a Next.js API route. I have a router.ts file located at /api/auth/sign-in with a simple logic as follows:
When I make a POST request using the following code:
The POST request works correctly, but the redirection doesn't happen. In the network tab, I can see the information shown in the attached image.
Does anyone have insights into what might be causing this issue? Any help or suggestions would be greatly appreciated.
I'm encountering an issue with redirection using a Next.js API route. I have a router.ts file located at /api/auth/sign-in with a simple logic as follows:
export async function POST(request: Request) {
const requestUrl = new URL(request.url);
return NextResponse.redirect(
`${requestUrl.origin}/auth/register`,
{
status: 301
}
);
}
When I make a POST request using the following code:
export const handleSignIn = async(data : ILoginForm) => {
await fetch('/api/auth/sign-in', {
method: 'POST',
body: JSON.stringify(data)
});
};
The POST request works correctly, but the redirection doesn't happen. In the network tab, I can see the information shown in the attached image.
Does anyone have insights into what might be causing this issue? Any help or suggestions would be greatly appreciated.
![Image](https://cdn.discordapp.com/attachments/1182434429902266428/1182434430158110821/image.png?ex=6584aee0&is=657239e0&hm=23d4b54b8fbe01a849fb68ad41530fdbf2d9a8e53aa522b6f6e8462828773ecd&)
Answered by risky
you need to either use server actions or add a redirect after the fetch on client
32 Replies
![Avatar](https://cdn.discordapp.com/embed/avatars/4.png)
American
Can you use
redirect
instead?![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
@American I tried but it didnt work
![Avatar](https://cdn.discordapp.com/embed/avatars/4.png)
American
How did you do it? I use it in lots of route files
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
@American I will send you a pic now
![Image](https://cdn.discordapp.com/attachments/1182434429902266428/1182439358687625256/image.png?ex=6584b377&is=65723e77&hm=4daaa0fa34d676af2e1921621c199f748147df86f2c0cab88300820582ea14e2&)
@American I tried this =
But didnt work
But didnt work
![Image](https://cdn.discordapp.com/attachments/1182434429902266428/1182440603296997426/image.png?ex=6584b4a0&is=65723fa0&hm=b84dca34ae933cae083a17b0ac3a5fcc05902bbd09fe26c3940e97a0485c6ed5&)
![Avatar](https://cdn.discordapp.com/embed/avatars/4.png)
American
it didn't work meaning you're not redirected?
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
No im not
Something its happening because register appears on the network, but im not getting redirected
![Image](https://cdn.discordapp.com/attachments/1182434429902266428/1182441707250397215/image.png?ex=6584b5a7&is=657240a7&hm=1c48fde110e97d0687613ab40f450c805863431a404cfe55e5845b71885054a8&)
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
I make it work by not ussing a router.ts
![Avatar](https://cdn.discordapp.com/avatars/657067112434499595/aff4eeb34922ca980b0d5fbb5bc60c21.webp?size=256)
risky
you need to either use server actions or add a redirect after the fetch on client
Answer
![Avatar](https://cdn.discordapp.com/avatars/194128415954173952/708a8637ada505b6b7a85972807d9dca.webp?size=256)
Alfonsus Ardani
Fetch does not handle redirect well
you need to use <form> if you want to redirect to work properly
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
you mean de form action?
![Avatar](https://cdn.discordapp.com/avatars/194128415954173952/708a8637ada505b6b7a85972807d9dca.webp?size=256)
Alfonsus Ardani
![Image](https://cdn.discordapp.com/attachments/1182434429902266428/1182507726090289293/image.png?ex=6584f323&is=65727e23&hm=61071ac0c7692fa9ae1235957842d5e84f104a9e18bde32fc8ddde16c2238102&)
yes, this works
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
Yes but im using react hook form
![Avatar](https://cdn.discordapp.com/avatars/194128415954173952/708a8637ada505b6b7a85972807d9dca.webp?size=256)
Alfonsus Ardani
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
i need to use the handleSubmit of react hook form
![Avatar](https://cdn.discordapp.com/avatars/194128415954173952/708a8637ada505b6b7a85972807d9dca.webp?size=256)
Alfonsus Ardani
well, in that case, try handling the redirect in the client side
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
I solved it on this way
i deleted the router.ts
and then i create a server side function
![Avatar](https://cdn.discordapp.com/avatars/657067112434499595/aff4eeb34922ca980b0d5fbb5bc60c21.webp?size=256)
risky
so server action?
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
Yes let me a second i will show you im opening the ide
![Avatar](https://cdn.discordapp.com/avatars/194128415954173952/708a8637ada505b6b7a85972807d9dca.webp?size=256)
Alfonsus Ardani
Server Actions works too, im glad you found that out
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
![Image](https://cdn.discordapp.com/attachments/1182434429902266428/1182508188403241072/image.png?ex=6584f392&is=65727e92&hm=fafedcedb0389a202fc2d90882365718042397ef1523dbb01f446940303ea454&)
But with router.ts i couldnt make it work
![Avatar](https://cdn.discordapp.com/avatars/194128415954173952/708a8637ada505b6b7a85972807d9dca.webp?size=256)
Alfonsus Ardani
there are limitation with route.ts and using fetch()
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
Yes i need to learn more about it
![Avatar](https://cdn.discordapp.com/avatars/657067112434499595/aff4eeb34922ca980b0d5fbb5bc60c21.webp?size=256)
risky
unless you really need to, id say server actions give better dx with more features such as this (normal route handers are still good for 3rd party things tho)
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
American black bearOP
Thank you very much for the info