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

[murphypetercl]

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?

[dustin-we]

Would also love to know how to get it to work with clerk.

I tried using the nuxt settings with no success.

[github-actions[bot]]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 30 days.

[1337NamNori]

I have the same issue when trying to integrate Firebase as a third-party auth service. My only solution until now is to remove the nuxt-supabase module and use the pure supabase-js library.