Kinde•3w ago

Kinde working on local but not working on live Envoirment

I'm working on a site with Kinde authentication applied to the inner pages of the /experience route. While everything works as expected locally, the live site at https://www.setoo.co/experience is showing a 500 error when accessing these inner pages. Here’s the middleware code used to protect the inner pages:

 import { withAuth } from "@kinde-oss/kinde-auth-nextjs/middleware";

export default withAuth({
    loginPage: '/api/auth/login',  // Redirect to login page if not authenticated
    isReturnToCurrentPage: true,
});

export const config = {
    matcher: ["/experience/:path*"], // Protect inner pages under /experience
};

 import { withAuth } from "@kinde-oss/kinde-auth-nextjs/middleware";

export default withAuth({
    loginPage: '/api/auth/login',  // Redirect to login page if not authenticated
    isReturnToCurrentPage: true,
});

export const config = {
    matcher: ["/experience/:path*"], // Protect inner pages under /experience
};

I’m unsure why this error only occurs on the live site and would appreciate any guidance on resolving this issue. I have attached a video of the issue for better understanding https://jam.dev/c/3163f5e3-b557-406b-bcda-8ef770ff9d80

2 Replies

IkiTg07•3w ago

Hey. Middleware and NextJS are not really a good mix

As of right now the middleware in the app router does not work when trying to redirect to api/auth/login. This is because of Next.js caching which causes issues during authentication.

https://docs.kinde.com/developer-tools/sdks/backend/nextjs-sdk/#protect-routes-using-middleware

Kinde docs

Next.js App Router SDK

Our developer tools provide everything you need to get started with Kinde.

IkiTg07•3w ago

In my end usually my protected routes are in a grouped folder like /dashboard so i'll create a layout in which I will check for the authenticated user and role before doing something else

Gaming

Programming

Kinde working on local but not working on live Envoirment