mirror of
https://github.com/vercel/next.js.git
synced 2026-09-20 02:25:18 +08:00
fc4f062ba9
### What? Upgrade with-supabase example to be compatible with Next.js 16 ### Why? 1. Users get console warnings about middleware vs proxy 2. Enabling Cache Components config results in build errors for async behaviour outside Suspense boundary 3. Turbopack flag is default and therefore, no longer necessary on `npm run dev` ### How? 1. Renamed all instances of `middleware` to `proxy` 2. Wraped async behaviour in Suspense boundaries 3. Removed --turbopack flag from `npm run dev` --------- Co-authored-by: JJ Kasper <jj@jjsweb.site>
77 lines
2.6 KiB
TypeScript
77 lines
2.6 KiB
TypeScript
import { createServerClient } from "@supabase/ssr";
|
|
import { NextResponse, type NextRequest } from "next/server";
|
|
import { hasEnvVars } from "../utils";
|
|
|
|
export async function updateSession(request: NextRequest) {
|
|
let supabaseResponse = NextResponse.next({
|
|
request,
|
|
});
|
|
|
|
// If the env vars are not set, skip proxy check. You can remove this
|
|
// once you setup the project.
|
|
if (!hasEnvVars) {
|
|
return supabaseResponse;
|
|
}
|
|
|
|
// With Fluid compute, don't put this client in a global environment
|
|
// variable. Always create a new one on each request.
|
|
const supabase = createServerClient(
|
|
process.env.NEXT_PUBLIC_SUPABASE_URL!,
|
|
process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY!,
|
|
{
|
|
cookies: {
|
|
getAll() {
|
|
return request.cookies.getAll();
|
|
},
|
|
setAll(cookiesToSet) {
|
|
cookiesToSet.forEach(({ name, value }) =>
|
|
request.cookies.set(name, value),
|
|
);
|
|
supabaseResponse = NextResponse.next({
|
|
request,
|
|
});
|
|
cookiesToSet.forEach(({ name, value, options }) =>
|
|
supabaseResponse.cookies.set(name, value, options),
|
|
);
|
|
},
|
|
},
|
|
},
|
|
);
|
|
|
|
// Do not run code between createServerClient and
|
|
// supabase.auth.getClaims(). A simple mistake could make it very hard to debug
|
|
// issues with users being randomly logged out.
|
|
|
|
// IMPORTANT: If you remove getClaims() and you use server-side rendering
|
|
// with the Supabase client, your users may be randomly logged out.
|
|
const { data } = await supabase.auth.getClaims();
|
|
const user = data?.claims;
|
|
|
|
if (
|
|
request.nextUrl.pathname !== "/" &&
|
|
!user &&
|
|
!request.nextUrl.pathname.startsWith("/login") &&
|
|
!request.nextUrl.pathname.startsWith("/auth")
|
|
) {
|
|
// no user, potentially respond by redirecting the user to the login page
|
|
const url = request.nextUrl.clone();
|
|
url.pathname = "/auth/login";
|
|
return NextResponse.redirect(url);
|
|
}
|
|
|
|
// IMPORTANT: You *must* return the supabaseResponse object as it is.
|
|
// If you're creating a new response object with NextResponse.next() make sure to:
|
|
// 1. Pass the request in it, like so:
|
|
// const myNewResponse = NextResponse.next({ request })
|
|
// 2. Copy over the cookies, like so:
|
|
// myNewResponse.cookies.setAll(supabaseResponse.cookies.getAll())
|
|
// 3. Change the myNewResponse object to fit your needs, but avoid changing
|
|
// the cookies!
|
|
// 4. Finally:
|
|
// return myNewResponse
|
|
// If this is not done, you may be causing the browser and server to go out
|
|
// of sync and terminate the user's session prematurely!
|
|
|
|
return supabaseResponse;
|
|
}
|