failed to redirect from the server action
Answered
Polish posted this in #help-forum
PolishOP
I was trying to implement the logout action but i keep getting this error when i want to redirect to login page after logout,need help
Error: NEXT_REDIRECT
at getRedirectError (webpack-internal:///(rsc)/./node_modules/next/dist/client/components/redirect.js:49:19)
at redirect (webpack-internal:///(rsc)/./node_modules/next/dist/client/components/redirect.js:60:11)
at logOutAction (webpack-internal:///(rsc)/./app/actions/logOutAction.ts:11:62)
at $$ACTION_0 (webpack-internal:///(rsc)/./app/home/page.tsx:41:72)
import React from "react";
import { logOutAction } from "../actions/logOutAction";
export default function Home() {
return (
<>
<form action={async () => {
"use server"
logOutAction()
}}>
<Button type="submit" >Logout</Button>
</form>
</>
);
}import { deleteSession } from "../lib/session"
import { RedirectType, redirect } from "next/navigation";
export async function logOutAction() {
deleteSession();
redirect('/login');
}Error: NEXT_REDIRECT
at getRedirectError (webpack-internal:///(rsc)/./node_modules/next/dist/client/components/redirect.js:49:19)
at redirect (webpack-internal:///(rsc)/./node_modules/next/dist/client/components/redirect.js:60:11)
at logOutAction (webpack-internal:///(rsc)/./app/actions/logOutAction.ts:11:62)
at $$ACTION_0 (webpack-internal:///(rsc)/./app/home/page.tsx:41:72)
19 Replies
@Polish I was trying to implement the logout action but i keep getting this error when i want to redirect to login page after logout,need help
import React from "react";
import { logOutAction } from "../actions/logOutAction";
export default function Home() {
return (
<>
<form action={async () => {
"use server"
logOutAction()
}}>
<Button type="submit" >Logout</Button>
</form>
</>
);
}
import { deleteSession } from "../lib/session"
import { RedirectType, redirect } from "next/navigation";
export async function logOutAction() {
deleteSession();
redirect('/login');
}
Error: NEXT_REDIRECT
at getRedirectError (webpack-internal:///(rsc)/./node_modules/next/dist/client/components/redirect.js:49:19)
at redirect (webpack-internal:///(rsc)/./node_modules/next/dist/client/components/redirect.js:60:11)
at logOutAction (webpack-internal:///(rsc)/./app/actions/logOutAction.ts:11:62)
at $$ACTION_0 (webpack-internal:///(rsc)/./app/home/page.tsx:41:72)
try putting the redirect into a try catch and rethrow if its a next redirect error:
try {
redirect('/login');
} catch (error) {
if (isRedirectError(error)) throw error;
}PolishOP
yes its throws the next redirect error
@Polish yes its throws the next redirect error
ok now dont throw it instead just log something
PolishOP
ok then how do i solve it?
@Polish ok then how do i solve it?
try {
redirect('/login');
} catch (error) {
if (isRedirectError(error)) console.log("test")
}PolishOP
i mean it still don't redirect to '/login' when i click the logout button
@Polish i mean it still don't redirect to '/login' when i click the logout button
i just realized u need to put redirect outside of your try catch
try {
// ...
} catch (error) {
// ...
}
redirect(`/login`)PolishOP
try {
deleteSession();
} catch (error) {
console.log('failed to delete session');
}
redirect('/login');still doesnot work ,same error
PolishOP
yes
thats strange
u might need to handle the redirect on the clientside
PolishOP
can you provide some hint for how to achieve that
@Polish can you provide some hint for how to achieve that
return 200 and redirect based on that
Havana
Hey.
1) Ensure that if the deleteSession is async, add await.
2) return redirect instead of just calling it
1) Ensure that if the deleteSession is async, add await.
2) return redirect instead of just calling it
Havana
and make you
await logOutAction(), since it's an async functionAnswer
@Havana Hey.
1) Ensure that if the deleteSession is async, add await.
2) return redirect instead of just calling it
PolishOP
Oops i forgot to add await for async call it works now
Thanks @Havana @gin
import { deleteSession } from "../lib/session";
import { redirect } from "next/navigation";
export async function logOutAction() {
try {
deleteSession();
} catch (error) {
console.log("Failed to delete session");
}
return redirect('/login')
} <>
<form action={async () => {
"use server"
await logOutAction()
}}>
<Button type="submit" >Logout</Button>
</form>
</>Thanks @Havana @gin
Havana
😎