SupabaseS
Supabase•2y ago
John

The right way to initialize a client using the `ssr` package?

I'm currently following through the docs (https://supabase.com/docs/guides/auth/server-side/creating-a-client?environment=client-component#creating-a-client). I noticed that when using the ssr package, user session is shared through the entire stack.

Creating a Supabase client with the ssr package automatically configures it to use cookies. This means your user's session is available throughout the entire Next.js stack - client, server, App Router, Pages Router. It just works!

Previously, I'd use to keep a separate file like src/lib/supabase.ts:

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

const supabaseUrl: string = process.env.NEXT_PUBLIC_SUPABASE_URL as string;
const supabaseAnonKey: string = process.env
  .NEXT_PUBLIC_SUPABASE_ANON_KEY as string;

export const supabase = createClient(supabaseUrl, supabaseAnonKey, {
  auth: {
    autoRefreshToken: false,
    persistSession: false,
    detectSessionInUrl: false,
  },
});

However, based on the docs, it seems like flexibly initializing seems to be better.

I'd like to know how other people have implemented auth in their apps before. Fyi, I am trying to implement server-side auth using Supabase with Next.js. So if there's any helpful materials other than the docs, recommendations are more than welcome.
Creating a Supabase client for SSR | Supabase Docs
Configure Supabase client to use Cookies
Was this page helpful?