Redirect to home page on signOut

[marksmall]

Summary

When I click the button that calls the signOut function, I am always redirected to api/auth/signin. What I want is to be redirected to some public page instead.

Code used to signOut and redirect:

<button onClick={() => signOut({ callbackUrl: '/' })}>
  Sign Out
</button>

The URL I am always sent to is http://localhost:3000/api/auth/signin?callbackUrl=%2F.

Why am I redirected to the signin page and is there anything I can do to prevent that?

Additional information

No response

Example

No response

[onlyhasbi]

set redirect property to true

<button onClick={() => signOut({ callbackUrl: '/', redirect:true })}>
  Sign Out
</button>

[juliusmc01]

Thanks!

[guylepage3]

@marksmall, any luck resolving this?

[gevuong]

I encountered the same issue using

<Link href="/api/auth/signout">
     Sign Out
</Link>

where /api/auth/signout is a REST API provided by NextAuth..

What worked for me was replacing it with the following, which, looks exactly like what you had..I didn't need redirect: true in the object parameter.

<button onClick={() => signOut({ callbackUrl: '/' })}>
     Sign out
</button>

[guylepage3]

What worked?

[gevuong]

Btw I'm using "next-auth": "^4.24.6" and "next": "14.1.0"

[guylepage3]

@gevuong what version of node are you running?

[gevuong]

v18.18.2

[Misbahoo]

The solution by @gevuong worked for me. Using next-auth version 4.24.7 and nextjs14.1.0

[marksmall]

I should have posted back here ages ago, sorry for not doing so.

What i ended up doing was :

<button onClick={() => {
    signOut();
    router.push('/');
}>
  Sign Out
</button>

[meghnadutta02]

Does Next-Auth provide the signOut function?

[orocsy]

Yes and I think it's preferably to use it since it do some stuff like clearing token related cookies under the hood. You could also wrap a logout method to add additional logout logic e.g.: backend invalidation of your jwt token

[marksmall]

I'm not saying my way is the best/correct/recommended way, but it worked, so was good enough for me.

[gpamfilis]

route.push worked for me too. But, how do we do it properly?

[DashkovMykyta]

If it still a case. This works for me:
In api/auth/[...nextauth]/route.ts - set redirect in callbacks like this:
async redirect({ url, baseUrl }) { if (url.startsWith("/")) return${baseUrl}${url}; return baseUrl },

Usage:
onClick: () => signOut({ callbackUrl: "/auth/login", redirect: true })

[iamBlissMedik]

@DashkovMykyta thanks. This worked for me

[justinherrera]

For NextAuth, v5-beta
signOut({ redirectTo: "/login", redirect: true })

[Aekaay123]

have you encountered sth like ,although redirected ,but the route is not changing

[mhussainahmad]

Add redirect function in callbacks of NextConfig. This will be same for sign-in and signout. In this case it is redirecting towards home page.

redirect: async ()=>{
return absoluteUrl("/")
}

[orocsy]

In my case(next-auth v4.24) the /api/auth related route I'm using localhost:3000, page public url is under domain localhost:3001. If you only use signOut({ callbackUrl: `/login`, redirect: true, }); then it'll redirect you to localhost:3000/login instead of "localhost:3001/login" which is the correct page url. This is where the redirect function comes in to control your redirect url composition. You could either config at next.config.js or in your NextAuth's AuthOptions -> callbacks option:

callbacks: {
    async session({ session, token }) {
      //logic...
      return session;
    },
    async jwt({ token, user, accessToken }) {
      //logic...
      return token;
    },
    authorized({ request, auth }) {
      // auth logic...
    },
    async redirect({ url, baseUrl }) {

      const frontendUrl = process.env.NEXT_PUBLIC_FRONTEND_URL || baseUrl;

      if (url.startsWith('/')) {
        return `${frontendUrl}${url}`;
      }

      try {
        const parsedUrl = new URL(url);
        if (parsedUrl.origin === frontendUrl) {
          return url;
        }
      } catch (error) {
        console.error('Invalid URL in redirect:', url);
      }

      return baseUrl;
    },
  },

Then in your signOut you may want to do sth like this:

signOut({
        callbackUrl: `${process.env.NEXT_PUBLIC_FRONTEND_URL}/login`,
        redirect: true,
    });

[kendrickkim82]

thanks so much~!