Search code examples
javascriptnext.jsnext-auth

Next Auth middleware and protected folder


I am building a NextJS app and I have a series of routers at pages/dashboard/* that I want to protect. I am using Prisma but for the moment what I want to do is to being able to access the routes only if the user is logged in. I am using Google provider and everything is setup correctly. This is my middleware.ts

export { default } from "next-auth/middleware"

export const config = { matcher: ["/dashboard"] }

Is very simple. This 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 the secrets in a .env.local also the NEXTAUTH_SECRET created locally. The problem I am facing is that whenever the user goes to dashboard it gets redirected to the login, once you login the page is still not accessible and keeps asking for login. I noticed that the useSession returns me the data in the browser, but apparently the token or session in the node side is null. I have Next 13.2.4 and Next Auth ^4.20.1 I can't figure out why is not working, I tried all the solutions proposed in other questions but none of them works and I am unable to see the dashboard. Any help? Thanks


Solution

  • Found the solution, for those who might be in the same situation: I added the strategy to the next auth options:

     session: {
        strategy: "jwt",
      },
    

    and now it works.