nuxt-auth demo page

🔐 nuxt-auth

npm versionnpm downloadsGitHub starsLicenseFollow us on TwitterJoin our Discord

nuxt-auth is a feature-packed, open-source authentication module for Nuxt 3 applications.

Quick Start

npm i -D @sidebase/nuxt-auth

Then visit the Quick Start documentation to setup the module.


nuxt-auth wraps NextAuth.js to offer the reliability & convenience of a 12k star library to the nuxt 3 ecosystem with a native developer experience (DX). Features of nuxt-auth include:

  • ✔️ Authentication providers:
    • ✔️ OAuth (e.g., Github, Google, Twitter, Azure, ...)
    • ✔️ Custom OAuth (write it yourself)
    • ✔️ Credentials (password + username)
    • ✔️ Email Magic URLs
  • ✔️ Isomorphic / Universal Auth Composable useSession supports:
    • actions: getSession, getCsrfToken, getProviders, signIn, signOut
    • getters: status, data, lastRefreshedAt
    • full typescript support for all methods and property
  • ✔️ Application-side middleware protection
  • ✔️ Server-side middleware and endpoint protection
  • ✔️ Advanced features for session life-cycle management:
    • Refresh the session periodically
    • Refresh the session on tab-refocus
    • One time session fetch on page load, afterwards for specific actions (e.g., on navigation)
    • 🚧 Session broadcasting between tabs (see #70)
  • ✔️ Persistent sessions across requests
  • ✔️ REST API:
    • GET /signin,
    • POST /signin/:provider,
    • GET/POST /callback/:provider,
    • GET /signout,
    • POST /signout,
    • GET /session,
    • GET /csrf,
    • GET /providers

Demo Page

Visit the nuxt-auth demo page here: nuxt-auth demo page

You can find the demo source-code here.


  • Run npm run dev:prepare to generate type stubs.
  • Use npm run dev to start the module playground in development mode.
  • Run npm run lint to run eslint
  • Run npm run types to run typescheck via tsc
  • Run npm publish --access public to publish (bump version before)

Module Playground

This module also has it's own playground:

> git clone> cd nuxt-auth# **OPEN THE `~/playground/server/api/auth/[...].ts` and configure your own auth-provider> npm i> npm run dev:prepare> npm run dev# -> open http://localhost:3000