Next.js Discord

Discord Forum

NextAuth 5 beta - protect routes with middleware

Answered
Plott Hound posted this in #help-forum
Open in Discord
Plott HoundOP
In next auth V4 i was protecting my routes like this in my middleware file:
export { default } from "next-auth/middleware";

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

based on the updated docs:
- export { auth as middleware } from './auth'
+ import authConfig from "./auth.config"
+ import NextAuth from "next-auth"
+ export const { auth: middleware } = NextAuth(authConfig)

I tried this: 
import authConfig from "./auth.config"
import NextAuth from "next-auth"
export const { auth: middleware } = NextAuth(authConfig)

but it does nothing. what am i missing? My auth is fully working i'd just like to protect the routes with middleware instead of doing it in a lot of RSC's.

Sorry if this is a dumb question, im rubbish with auth

Thanks
Answered by Ray
you need the authorized function in the callback
View full answer

23 Replies

Ray
try 
import authConfig from "./auth.config"
import NextAuth from "next-auth"
export default NextAuth(authConfig).auth;
make sure middleware.ts is in the right location
root of directory or under src if you are using src folder
@Ray make sure `middleware.ts` is in the right location root of directory or under src if you are using src folder
Plott HoundOP
thanks i just tried this in my /middleware.ts restarted the server and i can see it loaded but i can see still see any route when im logged out
edit: using prisma adapter if it makes any difference. I was using the same setup in V4 with the prisma adapter and it worked
Ray
how does your auth.config look like?
 callbacks: {
    authorized({ auth, request: { nextUrl } }) {
      const isLoggedIn = !!auth?.user;
      const isOnDashboard = nextUrl.pathname.startsWith("/dashboard");
      if (isOnDashboard) {
        if (isLoggedIn) return true;
        return false;
      } else if (isLoggedIn) {
        return Response.redirect(new URL("/dashboard", nextUrl));
      }
      return true;
    },
    ....
  }
Plott HoundOP
auth config:
import GitHub from "next-auth/providers/github"

import type { NextAuthConfig } from "next-auth"

export default {
    providers: [
        GitHub({
          clientId: process.env.GITHUB_ID,
          clientSecret: process.env.GITHUB_SECRET,
        }),
      ],
} satisfies NextAuthConfig
auth.ts:
import NextAuth from "next-auth"
import { PrismaAdapter } from "@auth/prisma-adapter"
import prisma from "@/db/prisma";
import authConfig from "@/auth.config"

export const { handlers, auth } = NextAuth({
  adapter: PrismaAdapter(prisma),
  session: { strategy: "jwt" },
  callbacks: {
    jwt: async ({ user, token }) => {
      if (user) {
        token.uid = user.id;
      }
      return token;
    },
    session: async ({ session, token }) => {
      if (session?.user) {
        (session.user as any).id = token.uid;
      }
      return session;
    },
  },
  ...authConfig,
})

this is to get the user ID in the session but its a bit of a mess sorry
Answer
@Ray you need the authorized function in the callback
Plott HoundOP
🤦‍♂️ i see. thanks
Ray
return false if not authorized or redirecting
Plott HoundOP
should i do that in my auth.ts callback or make a callback in auth config?
again sorry for the dumb questions
Ray
auth config
Plott HoundOP
ok thanks i'll give it a go now
Ray
the providers should be set up in auth.ts, and other config go to auth.config.ts
Plott HoundOP
wow i really messed this up. i'll go through and update everything and get back to you. thanks
i think this threw me off:
https://authjs.dev/guides/upgrade-to-v5?authentication-method=server-component#edge-compatibility
Ray
hmm i think its fine, the reason why split to two file is because some library may not work in the environment of middleware. since you are not using something like bcrypt then it should be fine
Plott HoundOP
awesome. this will probably take me a day or two to implement so im gonna mark it as solved and open a new question if i get stuck. thank you!
Ray
np