You are viewing the docs for v0.5. This is not the latest version.

Quick Start

After installing the package, add the package to your nuxt.config.ts:

export default defineNuxtConfig({   modules: ['@sidebase/nuxt-auth'],})

Then create the authentication handler (NuxtAuthHandler) that will expose the API endpoints for handling all authentication-related requests and add at least one authentication provider:

// file: ~/server/api/auth/[...].tsimport { NuxtAuthHandler } from '#auth'import GithubProvider from 'next-auth/providers/github'export default NuxtAuthHandler({    providers: [        // @ts-expect-error You need to use .default here for it to work during SSR. May be fixed via Vite at some point        GithubProvider.default({           clientId: 'enter-your-client-id-here',           clientSecret: 'enter-your-client-secret-here'        })    ]})

That's it! You can now use all user-related functionality, for example:

Prior to v0.5.0 useAuth() was called useSession().
Application side
// file: e.g ~/pages/login.vueconst { status, data, signIn, signOut } = useAuth()status.value // Session status: `unauthenticated`, `loading`, `authenticated`data.value // Session data, e.g., expiration, user.email, ...await signIn() // Sign in the userawait signOut() // Sign out the user
Server side
// file: e.g: ~/server/api/session.get.tsimport { getServerSession } from '#auth'export default eventHandler(async (event) => {   const session = await getServerSession(event)   if (!session) {      return { status: 'unauthenticated!' }   }   return { status: 'authenticated!', text: 'im protected by an in-endpoint check', session }})

To learn how to protect pages read about the application-side usage, to learn how to protect server-routes and API endpoints read about the server-side usage.