Hono•6mo ago

Can't get webhook path to work

Whenever clerk fires a user_updated | user_created event I want to catch in on /webhook/clerk/user-updated path using hono routing. I get 404 everytime clerk fires that event. However, if I look at the typeof routes I see that I have /webhook/clerk/user-updated/$post I don't get it why the route is not accessible from the outside. This is my index.ts

...imports...

export const runtime = "edge";

const api = new Hono()
  .route("/users", usersController)
  .route("/onboarding", onboardingController)
  .route("/connections", connectionsController);

api.use("*", clerkMiddleware(), authMiddleware);

const webhook = new Hono().route("/", clerkUserUpdatedController);

const app = new Hono();
const routes = app
  .route("/api", api)
  .route("/webhook/clerk", webhook);

export const GET = handle(app);
export const POST = handle(app);
export const PATCH = handle(app);

export type AppType = typeof routes;

...imports...

export const runtime = "edge";

const api = new Hono()
  .route("/users", usersController)
  .route("/onboarding", onboardingController)
  .route("/connections", connectionsController);

api.use("*", clerkMiddleware(), authMiddleware);

const webhook = new Hono().route("/", clerkUserUpdatedController);

const app = new Hono();
const routes = app
  .route("/api", api)
  .route("/webhook/clerk", webhook);

export const GET = handle(app);
export const POST = handle(app);
export const PATCH = handle(app);

export type AppType = typeof routes;

This is my clerkUserUpdatedController const app = new Hono().post("/user-updated", async (c) => {}) <--- minimalist version and this is my NEXTJS middleware.ts

...imports...

const isOnboardingRoute = createRouteMatcher(["/onboarding(.*)"]);
const isPublicRoute = createRouteMatcher([
  "/sign-in",
  "/sign-up",
  "/webhook/clerk/user-updated",
]);
const isApiRoute = createRouteMatcher(["/api(.*)"]);

export default clerkMiddleware((auth, req: NextRequest) => {
  const { userId, sessionClaims, redirectToSignIn } = auth();

  if (userId && isOnboardingRoute(req)) {
    return NextResponse.next();
  }

  if (!userId && !isPublicRoute(req))
    return redirectToSignIn({ returnBackUrl: req.url });

  if (userId && !isApiRoute(req) && !sessionClaims?.metadata?.onboardingComplete) {
    const onboardingUrl = new URL("/onboarding/personal-info", req.url);
    return NextResponse.redirect(onboardingUrl);
  }

  if (userId && !isPublicRoute(req)) return NextResponse.next();
});

export const config = {
  matcher: [...boilerplate...],
};

...imports...

const isOnboardingRoute = createRouteMatcher(["/onboarding(.*)"]);
const isPublicRoute = createRouteMatcher([
  "/sign-in",
  "/sign-up",
  "/webhook/clerk/user-updated",
]);
const isApiRoute = createRouteMatcher(["/api(.*)"]);

export default clerkMiddleware((auth, req: NextRequest) => {
  const { userId, sessionClaims, redirectToSignIn } = auth();

  if (userId && isOnboardingRoute(req)) {
    return NextResponse.next();
  }

  if (!userId && !isPublicRoute(req))
    return redirectToSignIn({ returnBackUrl: req.url });

  if (userId && !isApiRoute(req) && !sessionClaims?.metadata?.onboardingComplete) {
    const onboardingUrl = new URL("/onboarding/personal-info", req.url);
    return NextResponse.redirect(onboardingUrl);
  }

  if (userId && !isPublicRoute(req)) return NextResponse.next();
});

export const config = {
  matcher: [...boilerplate...],
};

0 Replies

No replies yetBe the first to reply to this messageJoin

Gaming

Programming

Can't get webhook path to work