nuxt-modules / supabase

Supabase module for Nuxt.
https://supabase.nuxtjs.org
MIT License
682 stars 125 forks source link

Best way to integrate third party auth solutions with nuxt supabase? #378

Open murphypetercl opened 3 months ago

murphypetercl commented 3 months ago

From various sources it seems that the correct way to connect to supabase when using third party auth solutions such as Stytch or Clerk is to provide a jwt token in the bearer authorization as follows using the @supabase/supabase-js package:

import { createClient } from "@supabase/supabase-js";

const supabase = createClient( config.public.supabaseUrl, config.public.supabaseKey, { global: { headers: { Authorization: Bearer ${jwtToken}, }, }, }, );

It works but I call the above in multiple pages and see the "Multiple GoTrueClient instances detected in the same browser context. It is not an error, but this should be avoided as it may produce undefined behavior when used concurrently under the same storage key."

Is there a better way with nuxt/supabase to dynamically set the token after login and to have the client globally available across the app without creating a new one on each page?