[@supabase/ssr] Documentation for createServerClient & createBrowserClient

[biasedbit]

Improve documentation

Link

• createServerClient
• createBrowserClient

Describe the problem

Function names are pretty much self-explanatory but as I was reading through the implementation, both createServerClient and createBrowserClient have some conditional logic based on whether they're running on a browser, which I found to be surprising.

Describe the improvement

Add docs to clarify difference between functions and consequences of using them in the wrong env (e.g. what happens when createBrowserClient is used in server-side components and vice-versa).

Additionally:

• If the functions aren't meant to be used outside their envs, log a warning or raise an error.
• If it's okay to use either function in either env, explicitly state in docs.

Additional context

n/a

---

Happy to submit a PR with proposed changes once I understand the crossed-env usage caveats (mainly createBrowserClient on server-side, since createServerClient with cookies() on client-side will naturally fail due to "(...) importing a component that needs next/headers (...)".

[elie222]

I'm also wondering if there are any issues with initialising just once:

import { createBrowserClient } from "@supabase/ssr";
import { env } from "@/env.mjs";

export const createClient = (): any =>
  createBrowserClient(
    env.NEXT_PUBLIC_SUPABASE_URL,
    env.NEXT_PUBLIC_SUPABASE_ANON_KEY,
  );

export const browserClient = createClient();