mobile favicon
Composables

useSupabaseUser

Auto import and use your Supabase user with the useSupabaseUser composable

Once logged in, you can auto-import your user everywhere inside your vue files.

<script setup>
const user = useSupabaseUser()
</script>

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 user = useSupabaseUser()

  if (!user.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.


Made with Nuxt Studio