Chaining middlewares in Next js 14 for auth.js

Question

I have a next js application which has multiple lingual support. So I have a middleware to redirect users to URL with the locale. I want to implement auth js in this application.

export function middleware(request: any) {
  const pathname = request.nextUrl.pathname;

  const pathnameIsMissingLocale = locales.every(
    (locale) => !pathname.startsWith(`/${locale}/`) && pathname !== `/${locale}`
  );

  if (pathnameIsMissingLocale) {
    const locale = getLocale(request);

    return NextResponse.redirect(
      new URL(`/${locale}/${pathname}`, request.url)
    );
  }
}

export const config = {
  matcher: [
    // Skip all internal paths (_next, assets, api)
    //"/((?!api|assets|.*\\..*|_next).*)",
    "/((?!api|assets|docs|.*\\..*|_next).*)",
    // Optional: only run on root (/) URL
  ],
};

In this application, I want to implement authentication using auth.js v5. According to the docs, I have to add the below snippet in the middleware without any matcher.

import { auth as middleware } from "@/lib/auth";

How to resolve this issue? TIA

Renaming one of the functions doesn't help as it has to be middleware for it work.

Ahmet Firat Keler · Accepted Answer · 2024-09-28 08:57:37Z

0

This is how we set up a middleware along with next-auth.

import { NextRequest, NextResponse } from "next/server"
import { auth } from "auth" // auth.ts file

export default auth((request: NextRequest) => {
    // @ts-ignore
    const { auth } = request
    console.log("auth", auth)

    // TIP: this is how we set custom headers to be used in our application
    const headers = new Headers(request.headers)
    headers.set("x-current-path", request.nextUrl.pathname)
    return NextResponse.next({
        request: {
            headers: headers as Headers
        }
    })
})

export const config = {
    matcher: ["/((?!api|_next/static|_next/image|favicon.ico).*)"],
}

answered Sep 28, 2024 at 8:57

Ahmet Firat Keler

4,2502 gold badges16 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Chaining middlewares in Next js 14 for auth.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related