Creating a Supabase client for SSR
Configure your Supabase client to use cookies
To use Server-Side Rendering (SSR) with Supabase, you need to configure your Supabase client to use cookies. The @supabase/ssr
package helps you do this for JavaScript/TypeScript applications.
Install
Install the @supabase/ssr
and @supabase/supabase-js
packages:
_10npm install @supabase/ssr @supabase/supabase-js
Set environment variables
In your environment variables file, set your Supabase URL and Supabase Anon Key:
Project URL
Anon key
Create a client
You'll need some one-time setup code to configure your Supabase client to use cookies. Once your utility code is set up, you can use your new createClient
utility functions to get a properly configured Supabase client.
Use the browser client in code that runs on the browser, and the server client in code that runs on the server.
The following code samples are for App Router. For help with Pages Router, see the Next.js Server-Side Auth guide.
Next steps
- Implement Authentication using Email and Password
- Implement Authentication using OAuth
- Learn more about SSR