Next.js Discord

Discord Forum

failed to redirect from the server action

Answered
Polish posted this in #help-forum
Open in Discord
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

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)
Answered by Havana
and make you await logOutAction(), since it's an async function
View full answer

19 Replies

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
Havana
and make you await logOutAction(), since it's an async function
Answer
@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
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
😎