Can't logout using /api/auth/[kindeAuth]/route.ts
I'm currently using the NextJS SDK for implementing Kinde. Everything has been going great, but I have one problem: I can login and authenticate just fine. But I'm unable to log out of my app.
A few notes:
1. I'm testing on localhost (haven't tried in production, because we're not ready to go live yet).
2. I've set up all my environmental variables including both KINDE_POST_LOGOUT_REDIRECT_URL and NEXT_PUBLIC_KINDE_POST_LOGOUT_REDIRECT_URL
3. I added the KINDE_POST_LOGOUT_REDIRECT_URL to my next.config.mjs file, along with the other variables that are listed in the help docs
4. The logout redirect url is my Kinde instance (https://****-development.uk.kinde.com)
5. In my app, I have a link that calls: redirect(
/api/auth/logout?post_logout_redirect_url=https://${process.env.NEXT_PUBLIC_KINDE_POST_LOGOUT_REDIRECT_URL} ) using the redirect function from next/navigation
6. I've set up the api route in /api/auth/[kindeAuth]/route.ts (following this guide: https://docs.kinde.com/developer-tools/sdks/backend/nextjs-sdk/#install-for-an-existing-project)
7. If I click on the link, it just refreshes my page and I'm still logged in. It doesn't even try to redirect me to my Kinde instance
Not sure what I'm doing wrong? 🤔Kinde docs
Next.js App Router SDK
Our developer tools provide everything you need to get started with Kinde.
5 Replies
Hi Riven,
Thanks for the detailed context, To help us investigate further, could you please clarify the following:
1. What version of the Kinde SDK are you using?
2. Could you share the contents of your
/api/auth/[kindeAuth]/route.ts file?
3. Have you confirmed that this redirect URL is also listed under “Allowed Logout Redirect URLs” in your Kinde app settings?
These details will help us pinpoint what’s going wrong and get your logout flow working properly.Yeah, sure:
1. In the package.json: "@kinde-oss/kinde-auth-nextjs": "^2.7.0"
2. Contents of /api/auth/[kindeAuth]/route.ts:
import { handleAuth } from "@kinde-oss/kinde-auth-nextjs/server"
export const GET = handleAuth()
3. Yes, the allowed logout redirect URLs has the same URL. I tried previously having the redirect and the environmental variable set to http://localhost:3000, but that didn't seem to make a difference, either
also, my logout link is just a simple button that calls this function:
const handleLogout = () => {
redirect(
/api/auth/logout?post_logout_redirect_url=https://${process.env.NEXT_PUBLIC_KINDE_POST_LOGOUT_REDIRECT_URL} )
}Hi Riven,
Thanks for sharing the additional details.
I’ll discuss this internally with the team and get back to you as soon as I have more information. In the meantime, feel free to reach out if you have any other questions or need further assistance.
Thanks!
Just to update you, it seems to be an issue with using onClick for my button. The onClick function called a separate function that redirect to http://localhost:3000/api/auth/logout and that didn't work. I converted to a regular href link and it's working now.
Hi Riven,
Thanks for the additional context, that’s really helpful. I’ll pass this along to the team as well.
Let us know if anything else comes up