🛠 Add stateless session support for Nuxt apps using signed and encrypted cookies. Powered by iron-session.
The session data is stored in encrypted cookies ("seals"). And only your server can decode the session data. There are no session ids, making iron sessions "stateless" from the server point of view.
Demo https://nuxt-iron-session.vercel.app
npm install nuxt-iron-session// nuxt.config.ts
export default defineNuxtConfig({
modules: ['nuxt-iron-session'],
session: {
cookieName: 'yourapp_cookiename',
password: 'complex_password_at_least_32_characters_long',
cookieOptions: {
secure: process.env.NODE_ENV === 'production'
}
}
})// ~/server/api/login.ts
export default defineEventHandler((event) => {
// get user from database then:
event.context.session.user = {
id: 69,
admin: true,
}
await event.context.session.save()
return { ok: true }
})// ~/server/api/user.ts
export default defineEventHandler((event) => {
return { user: event.context.session.user }
})// ~/server/api/logout.ts
export default defineEventHandler((event) => {
await event.context.session.destroy()
return { ok: true }
})<script lang="ts">
const { ssrContext } = useNuxtApp()
// Available in client and server. Unique to each request.
const session = useState('session', () => ssrContext?.event?.context?.session)
</script>declare module 'iron-session' {
interface IronSessionData {
user?: {
id: number
admin?: boolean
}
}
}import { createIronSessionMiddleware } from 'nuxt-iron-session/middleware'
const app = createApp()
app.use(createIronSessionMiddleware({}))
app.use('/api/user', eventHandler((event) => ({ user: event.context.session.user })))Visit the iron-session docs to see the complete configuration.
- Run
npm run dev:prepareto generate type stubs. - Use
npm run devto start playground in development mode.
MIT