nuxt-clerk-utils
Clerk module that builds on top of vue-clerk
Features
- Server middleware based on h3-clerk
- Utilities for handling clerk webhooks
Requirements
This module only works with SSR (server-side rendering) enabled as it uses server API routes. You cannot use this module with nuxt generate.
Quick Setup
- Add
nuxt-clerk-utils
# Using pnpm
pnpm add -D nuxt-clerk-utils
# Using yarn
yarn add --dev nuxt-clerk-utils
# Using npm
npm install --save-dev nuxt-clerk-utils
- Add
nuxt-clerk-utils to nuxt.config.ts
export default defineNuxtConfig({
modules: ["nuxt-clerk-utils"],
});
Configuration
The following environment variables are required in order for this module to function correctly to be defined in your .env:
NUXT_PUBLIC_CLERK_PUBLISHABLE_KEY=".."
NUXT_CLERK_SECRET_KEY="..."
# Optional: Enable this if you want to handle clerk webhooks
NUXT_CLERK_WEBHOOK_SIGNING_SECRET=".."
Vue Composables
NOTE: All of the composables and components are re-exported from vue-clerk. See project documentation for usage
Server Utils
The following helpers are auto-imported in your server/ directory.
Session Management
// Get the current clerk session if it exists, null otherwise
const clerkSession = await getClerkSession(event);
// Require a clerk session (send back 401 if no `user` session exists)
const clerkSession = await requireClerkSession(event);
Webhooks
To work with webhooks, first create the webhook on the clerk dashboard, and define a handler for it in your app like so:
Note: You must provide the CLERK_WEBHOOK_SIGNING_SECRET env (see above)
When defining a webhook in this way, you can assume that the webhook is valid as its signature is automatically verified.
// server/routes/clerk.post.ts
export default defineClerkWebhook('user.created', ({ payload }) => {
console.log('payload', payload)
})
Development
# Install dependencies
pnpm install
# Generate type stubs
pnpm run dev:prepare
# Develop with the playground
pnpm run dev
# Build the playground
pnpm run dev:build
# Run ESLint
pnpm run lint
# Run Vitest
npm run test
npm run test:watch
# Release new version
npm run release
Prior art and acknowledgments
