Replies: 3 comments 7 replies
-
|
The flow is very similar, just that you need to get your cookies from the request object instead of the Check out the Next.js Starter Guide for how to set up a Supabase client inside your API route that reads the cookies from the request: https://supabase.com/docs/guides/auth/server-side/nextjs?router=pages Then it's just a matter of substituting the client. Everything else should be relatively router-agnostic (barring some minor differences in the request object and redirect function, which you can check the Next.js docs for). |
Beta Was this translation helpful? Give feedback.
-
|
Hi, we're in the same situation, still on legacy pages router but migrating to supabase/ssr package. Which client to use in |
Beta Was this translation helpful? Give feedback.
-
|
The latest version of the Next.js Pages router
import { type GetServerSidePropsContext } from 'next'
import { createServerClient, serializeCookieHeader } from '@supabase/ssr'
export function createClient({ req, res }: GetServerSidePropsContext) {
const supabase = createServerClient(
process.env.NEXT_PUBLIC_SUPABASE_URL!,
process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY!,
{
cookies: {
getAll() {
return Object.keys(req.cookies).map((name) => ({ name, value: req.cookies[name] || '' }))
},
setAll(cookiesToSet) {
res.setHeader(
'Set-Cookie',
cookiesToSet.map(({ name, value, options }) =>
serializeCookieHeader(name, value, options)
)
)
}
}
}
)
return supabase
}
import { createClient as createClientPrimitive } from '@supabase/supabase-js'
export function createClient() {
const supabase = createClientPrimitive(
process.env.NEXT_PUBLIC_SUPABASE_URL!,
process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY!
)
return supabase
}
import { createBrowserClient } from '@supabase/ssr'
export function createClient() {
const supabase = createBrowserClient(
process.env.NEXT_PUBLIC_SUPABASE_URL!,
process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY!
)
return supabase
}
import { createServerClient, serializeCookieHeader } from '@supabase/ssr'
import { type NextApiRequest, type NextApiResponse } from 'next'
export default function createClient(req: NextApiRequest, res: NextApiResponse) {
const supabase = createServerClient(
process.env.NEXT_PUBLIC_SUPABASE_URL!,
process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY!,
{
cookies: {
getAll() {
return Object.keys(req.cookies).map((name) => ({ name, value: req.cookies[name] || '' }))
},
setAll(cookiesToSet) {
res.setHeader(
'Set-Cookie',
cookiesToSet.map(({ name, value, options }) =>
serializeCookieHeader(name, value, options)
)
)
}
}
}
)
return supabase
}
These are from the last commit ( |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
-
Chore
SSR Oauth with next js pages router
Describe the chore
SSR Oauth doesn't work with next js pages router. The example here (https://supabase.com/docs/guides/auth/server-side/oauth-with-pkce-flow-for-ssr?framework=nextjs) uses apps router.
Since { cookies } from 'next/headers' needs a server component (not in pages router). i'm not sure how to implement. Does anyone have any tips?
Beta Was this translation helpful? Give feedback.
All reactions