I am currently developing a NextJS application and have implemented routers at pages/dashboard/* that I need to secure. My goal is to restrict access to these routes only to authenticated users. I am utilizing Prisma for data management, with Google as the authentication provider. All configurations are set up correctly.
This is my middleware.ts
export { default } from "next-auth/middleware"
export const config = { matcher: ["/dashboard"] }The setup is quite straightforward. Here is my [...nextAuth] file
import NextAuth, { NextAuthOptions } from "next-auth" import GoogleProvider from "next-auth/providers/google" import { PrismaAdapter } from "@next-auth/prisma-adapter" import { prisma } from "@/lib/db/prisma"
export const authOptions: NextAuthOptions = {
adapter: PrismaAdapter(prisma),
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_CLIENT_ID as string,
clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
authorization: {
params: {
prompt: "consent",
access_type: "offline",
response_type: "code",
},
},
}),
],
}
export default NextAuth(authOptions)I have stored secrets in a .env.local file and also created a NEXTAUTH_SECRET locally. However, I am encountering an issue where upon navigating to the dashboard, the user gets redirected to the login page. Even after successful login, the dashboard remains inaccessible and prompts for login repeatedly. Upon examining, I observed that while the useSession function returns data in the browser, the token or session on the server side appears to be null.
I am using Next 13.2.4 and Next Auth ^4.20.1, but despite trying various solutions suggested in similar questions, none seem to resolve the issue and I am unable to access the dashboard.
Any assistance would be greatly appreciated. Thank you.