Vue composables
useSupabaseSession
Auto import and use your Supabase user's session with the useSupabaseSession composable
Once logged in, you can auto-import your user's session everywhere inside your vue files.
<script setup>
const session = useSupabaseSession()
</script>
If you just need the User's information you can use useSupabaseUser which returns just the User information of the session.
Auth middleware
By default, the module is implementing a redirect middleware. All pages of your application are automatically redirected to the login page. However, you can allow redirection to "public" pages by setting the exclude redirect option. Alternatively, you can enable the redirect only for certain routes using the include redirect option.
If the redirect option is disabled, you can protect your authenticated routes by creating a custom middleware in your project, here is an example:
middleware/auth.ts
export default defineNuxtRouteMiddleware((to, _from) => {
const session = useSupabaseSession()
if (!session.value) {
return navigateTo('/login')
}
})
Then you can reference your middleware in your page with:
pages/dashboard.vue
definePageMeta({
middleware: 'auth'
})
Learn more about Nuxt middleware and definePageMeta.