Clerk middleware public routes

I have an ecommerce website with the / route being public, and I'm fetching categories from a publicProcedure, but it doesn't work if I'm not logged with clerk.
11 Replies
Sturlen
Sturlen14mo ago
make sure you Clerk middleware isn't matching for public routes. not much more to go on unless you can post the code
BootesVoid
BootesVoid14mo ago
So I fixed it by adding the specific trpc routes to publicRoutes,
import { authMiddleware } from "@clerk/nextjs";
import { redirect } from "next/navigation";
import { prisma } from "./server/db";

// This example protects all routes including api/trpc routes
// Please edit this to allow other routes to be public as needed.
// See https://clerk.com/docs/references/nextjs/auth-middleware for more information about configuring your middleware
export default authMiddleware({
publicRoutes: ["/api/webhooks/user", "/", "/api/trpc/category.getCategories", "/api/trpc/category.getSubCategories", "/api/trpc/category.getAllSubCategories"],
});

export const config = {
matcher: ["/((?!.*\\..*|_next).*)", "/", "/(api|trpc)(.*)"],
};
import { authMiddleware } from "@clerk/nextjs";
import { redirect } from "next/navigation";
import { prisma } from "./server/db";

// This example protects all routes including api/trpc routes
// Please edit this to allow other routes to be public as needed.
// See https://clerk.com/docs/references/nextjs/auth-middleware for more information about configuring your middleware
export default authMiddleware({
publicRoutes: ["/api/webhooks/user", "/", "/api/trpc/category.getCategories", "/api/trpc/category.getSubCategories", "/api/trpc/category.getAllSubCategories"],
});

export const config = {
matcher: ["/((?!.*\\..*|_next).*)", "/", "/(api|trpc)(.*)"],
};
but I dont want to do this for every route, why is this happening even though im using a publicProcedure. So I added these three, "/api/trpc/category.getCategories", "/api/trpc/category.getSubCategories", "/api/trpc/category.getAllSubCategories"
Sturlen
Sturlen14mo ago
a better solution would proably to let tRPC handle the route protection by itself and not running a seperate clerk middleware. create T3 app with next-auth handles this by default. I don't have an example at hand but the docs might have one. just replace the next-auth enforceUserIsAuthed with clerk's
Josip
Josip14mo ago
Any idea how to let tRPC handle route protection without Clerk middleware? As soon as middleware is removed, hitting tRPC routes errors out: tRPC failed on <no-path>: You need to use "authMiddleware" (or the deprecated "withClerkMiddleware") in your Next.js middleware file. You also need to make sure that your middleware matcher is configured correctly and matches this route or page.
Sturlen
Sturlen14mo ago
according to the docs, using /api/trpc/* as a public route in your middleware should let tRPC handle it instead of Clerk. https://clerk.com/docs/references/nextjs/auth-middleware#making-pages-public-using-public-routes
authMiddleware() | Next.js | Clerk
The authMiddleware() method allows you to protect your Next.js application using middleware.
BootesVoid
BootesVoid14mo ago
thanks!
BootesVoid
BootesVoid14mo ago
I just got a chance to try this
No description
BootesVoid
BootesVoid14mo ago
any idea what might be the problem
teos
teos14mo ago
Without the code, it'll be difficult to help you
Kenzo
Kenzo14mo ago
are u using ?
export default authMiddleware({
publicRoutes: ["/", "/api/trpc(.*)"],
});
export default authMiddleware({
publicRoutes: ["/", "/api/trpc(.*)"],
});
it creashes if you use directly /api/trpc/*
BootesVoid
BootesVoid14mo ago
ah right I did this. Thanks
Want results from more Discord servers?
Add your server