Nuxt3 server routes support?

[eMeRiKa13]

Hi,

Is-it working in Nuxt3 server side, in a server/api file?

I have the error useSupabaseUser is not defined. I tried to import them import { useSupabaseUser, useSupabaseClient } from '@nuxtjs/supabase'; but I have the error SyntaxError: The requested module '.../node_modules/@nuxtjs/supabase/dist/module.mjs' does not provide an export named 'useSupabaseClient'

Thanks

[atinux]

It is not intented to work but should be possible with few teaks, could you give us an example of what you are trying to achieve with a route API?

[eMeRiKa13]

I don't have any backend in my project https://1980.gg/ so I use the Nuxt 3 server API to check the user data and proceed the insert / update / delete on the database. I have Postgresql row level securities configured but I don't want to remove the "backend" side as I proceed to some checks.

Until now I'm using your first implementation of Supabase in Nuxt 3 with notably:

plugins/supabase.server.ts

import { useCookies } from 'h3'

export default defineNuxtPlugin(async (nuxtApp) => {
  const { user, auth } = useSupabase();
  const req = nuxtApp.ssrContext!.req;

  // Supabase needs to read from req.cookies
  req.cookies = useCookies(req);
  // Check authenticated user during SSR
  user.value = await (await auth.api.getUserByCookie(req)).user;
  // Fix SSR called to RLS protected tables
  if (user.value) {
    // https://github.com/supabase/supabase/issues/1735#issuecomment-922284089
    // @ts-ignore
    auth.session = () => ({
      access_token: req.cookies['sb:token']
    });
  }
})

but after updated to the latest Nuxt 3 version I had the error Cannot split a chunk that has already been edited (5:22 – "await (await auth.api.getUserByCookie(req)).user") so I wanted to switch to this module.

[jefflombard]

Seconded, I find this useful.

• enables the nuxt server to SSR in some cases rather than forcing client with data fetching https://v3.nuxtjs.org/guide/features/data-fetching/
• I'd rather write complex logic in /server than in a vue component

[eMeRiKa13]

Hi,

I'm still looking for a solution to this problem. I found in this module the plugin https://github.com/nuxt-community/supabase-module/blob/main/src/runtime/plugins/supabase.server.ts which says "Set subabase user on server side"

So my question is, how do I get the user from server side? If it is set, it must be possible to retrieve it?

Thanks

[larbish]

Hello @eMeRiKa13, I need to find a way to use composables on server side. This is not as simple as that because composables use internals only accessible in vue context and not in nitro context. I mentioned your issue in #31. I'll quickly come back to you with a way to do it.

[eMeRiKa13]

Thanks for your answer @larbish! Let me know if I can help you

[Bryanoxx]

If it can help some people, I made a server/middleware/auth.ts that adds the current user to event.context.user :

import { createClient } from '@supabase/supabase-js'

export default defineEventHandler(async (event) => {
  // Setting up the database connection
  const config = useRuntimeConfig()
  const supabase = createClient(config.SUPABASE_URL, config.SUPABASE_SECRET_KEY)

  // Getting the current user
  const auth = await supabase.auth.api.getUserByCookie({ cookies: useCookies(event.req) })

  // Saving supabase and the user in the current context
  event.context.supabase = supabase
  event.context.auth = auth?.token !== null ? auth : null
  event.context.user = auth?.user !== null ? auth.user : null
})

[robinscholz]

Running into the same problem …

I'd like to pass the client in a callback function to a crawler that runs in the background asynchronously.

[mubaidr]

If it can help some people, I made a server/middleware/auth.ts that adds the current user to event.context.user :

import { createClient } from '@supabase/supabase-js'

export default defineEventHandler(async (event) => {
  // Setting up the database connection
  const config = useRuntimeConfig()
  const supabase = createClient(config.SUPABASE_URL, config.SUPABASE_SECRET_KEY)

  // Getting the current user
  const auth = await supabase.auth.api.getUserByCookie({ cookies: useCookies(event.req) })

  // Saving supabase and the user in the current context
  event.context.supabase = supabase
  event.context.auth = auth?.token !== null ? auth : null
  event.context.user = auth?.user !== null ? auth.user : null
})

But is this super intensive? or should I say expensive, fetching user session with every API/ route call?