Clerk Auth Middleware and Custom Middlewae

[slyguy5646]

Hi there,

I'm currently working on a project with Next 13.4 (App Router) and I'm trying to implement middleware. The problem is, is that my app requires other custom middleware in addition to the clerk middleware.

My custom middleware looks like this

• This is custom logic to implement a simple version of password protection for a data page as opposed to having user auth for this page

// src/middleware.ts
function parseCookie(str: string | undefined) {
  if (str){

    return str.split(";").map((v) => v.split("="))[0][1];
  }else return null
}

export async function middleware(req: NextRequest) {
  const loginCookie = req.cookies.get("login");

  const { pathname } = req.nextUrl;

  if (pathname.startsWith("/data")) && !parseCookie(loginCookie?.value)) {
    return NextResponse.redirect(new URL("/password-protect", req.url));
  } else if (pathname.startsWith("/password-protect") && parseCookie(loginCookie?.value)) {
    return NextResponse.redirect(new URL("/data", req.url));
    
  }

  return NextResponse.next();
}

export const config = {
  matcher: ["/data", "/password-protect"],
};

There are other admin pages that will be for managing this data that I do want only authorized users (via a Clerk managed account) to access. Is there a way for me to combine both my existing custom middleware with the Clerk authMiddleware helper? And I only would want to apply the custom middleware to the routes in the config and the clerk middleware to the admin routes that I specify.

Thanks in advance.

[PrinceBaghel258025]

@slyguy5646 Hii, have you found any workaround for this problem ?
actually I have to make requests to the Next.js api endpoints from a message queue service and not able to pass the authMiddleware, So I think I can also do the same or any workaround you would suggest ?

[slyguy5646]

They have this api for public routes.

import { authMiddleware } from "@clerk/nextjs";
export default authMiddleware({
  // "/" will be accessible to all users
  publicRoutes: ["/"]
});
 
export const config = {
      matcher: ['/((?!.+\\.[\\w]+$|_next).*)', '/', '/(api|trpc)(.*)'],
};

They have a few options for middleware which work I think. https://clerk.com/docs/references/nextjs/auth-middleware#using-before-auth-to-execute-middleware-before-authentication not sure of your exact use case.

[jescalan]

https://github.com/orgs/clerk/discussions/3829