logo Windmill Hub
Login
All items
0

Supabase Authentication Example - frontend scripts version

by
Published Mar 16, 2023

Example app (with frontend scripts) of how to use Supabase Authentication to query RLS enabled data. You can read more about this example [**here**](https://docs.windmill.dev/blog/supabase-authentication-and-rls-protected-tables-on-windmill). **Usage:** Update the `Login` script with your Supabase instance **URL** and **public anon key**.

App supabase Verified
Use in Windmill
Embed

The app

Static preview only: No backend
This is a static preview of the app and there is no backend. As such, the interactivity requiring script execution is non functional. To see the fully functional app, edit/run it in Windmill by clicking the button above.

Scripts used

state.supabase = {
	// You'll need to insert the URL and the public API key of your Supabase project here
	url: '',
	publicKey: '',
	client: state?.supabase?.client ?? undefined,
	error: undefined
};

const sb = await import('https://esm.sh/@supabase/[email protected]');
const client = sb.createClient(state.supabase.url, state.supabase.publicKey);
const { data, error, error_description } = await client.auth.signInWithPassword({
  // In frontend scripts you can directly reference components by their IDs
  email: b.result,
  password: c.result
});
if (data?.session?.access_token) {
  state.supabase.client = sb.createClient(state.supabase.url, state.supabase.publicKey, {
    global: { headers: { Authorization: `bearer ${data.session.access_token}` } }
  });
} else {
  state.supabase.client = undefined;
  state.supabase.error = error_description ?? error?.message ?? error ?? undefined;
}