āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā ā š shadcn/directory/clerk/clerk-docs/reference/astro/clerk-middleware ā āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
clerkMiddleware() | Astro'
description: The clerkMiddleware() function allows you to protect your Astro application using Middleware.
sdk: astroThe clerkMiddleware() helper integrates Clerk authentication into your Astro application through middleware.
clerkMiddleware()Create a middleware.ts file inside your src/ directory.
import { clerkMiddleware } from '@clerk/astro/server'
export const onRequest = clerkMiddleware()
createRouteMatcher()createRouteMatcher() is a Clerk helper function that allows you to protect multiple routes. createRouteMatcher() accepts an array of routes and checks if the route the user is trying to visit matches one of the routes passed to it.
The createRouteMatcher() helper returns a function that, if called with the context.request object from the Middleware, will return true if the user is trying to access a route that matches one of the routes passed to createRouteMatcher().
In the following example, createRouteMatcher() sets all /dashboard and /forum routes as protected routes.
const isProtectedRoute = createRouteMatcher(['/dashboard(.*)', '/forum(.*)'])
You can protect routes by checking either or both of the following:
To protect routes based on user authentication status, use auth().isAuthenticated{{ target: '_blank' }} to check if isAuthenticated is true. If it's not, the user is not authenticated, and you can redirect them to the sign-in page.
import { clerkMiddleware, createRouteMatcher } from '@clerk/astro/server'
const isProtectedRoute = createRouteMatcher(['/dashboard(.*)', '/forum(.*)'])
export const onRequest = clerkMiddleware((auth, context) => {
const { isAuthenticated, redirectToSignIn, userId } = auth()
if (!isAuthenticated && isProtectedRoute(context.request)) {
// Add custom logic to run before redirecting
return redirectToSignIn()
}
})
To protect routes based on user authorization status, use auth().has(){{ target: '_blank' }} to check if the user has the required roles or custom permissions.
import { clerkMiddleware, createRouteMatcher } from '@clerk/astro/server'
const isProtectedRoute = createRouteMatcher(['/admin(.*)'])
export const onRequest = clerkMiddleware((auth, context) => {
const { has, redirectToSignIn } = auth()
// Restrict admin routes to users with specific permissions
if (
(isProtectedRoute(context.request) && !has({ permission: 'org:admin:example1' })) ||
!has({ permission: 'org:admin:example2' })
) {
// Add logic to run if the user does not have the required permissions; for example, redirecting to the sign-in page
return redirectToSignIn()
}
})
To protect all routes in your application and define specific routes as public, you can use any of the above methods and simply invert the if condition.
import { clerkMiddleware, createRouteMatcher } from '@clerk/astro/server'
const isPublicRoute = createRouteMatcher(['/sign-in(.*)', '/sign-up(.*)'])
export const onRequest = clerkMiddleware((auth, context) => {
const { isAuthenticated, redirectToSignIn, userId } = auth()
if (!isPublicRoute(context.request) && !isAuthenticated) {
return redirectToSignIn()
}
})
clerkMiddleware() optionsOrganizationSyncOptionsā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā