I have a Next.js 14.2.9 project where I set up Supabase authentication.
I created a server-side Supabase client and configured cookies as shown below:
"use server";
import { createServerClient } from "@supabase/ssr";
import { cookies } from "next/headers";
export async function createClient() {
const cookieStore = cookies();
return createServerClient(
process.env.NEXT_PUBLIC_SUPABASE_URL!,
process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
{
cookies: {
getAll() {
return cookieStore.getAll();
},
setAll(cookiesToSet) {
cookiesToSet.forEach(({ name, value, options }) =>
cookieStore.set(name, value, {
...options,
secure: process.env.NODE_ENV === "production",
httpOnly: true, // Prevents access from client-side JavaScript
sameSite: "lax", // Protects against CSRF attacks
}),
);
},
},
},
);
}Then, I called this function in a server component in /src/app/page.tsx like this:
import { createClientServerSide } from "@/shared";
export default async function Home() {
const supabase = await createClientServerSide();
const { data } = await supabase.auth.getSession();
const { data: user } = await supabase.auth.getUser();
console.log(data);
console.log("User", user);
return <div></div>;
}Until yesterday, everything was working fine with no runtime errors. However, today, I started getting the following error:
⨯ unhandledRejection: tA [Error]: Cookies can only be modified in a Server Action or Route Handler. Read more: https://nextjs.org/docs/app/api-reference/functions/cookies#cookiessetname-value-options
I didn’t change a single line of code. Yesterday, it seemed like createClient() was recognized as a server action, so there were no issues. But today, it’s suddenly not recognized as a server action, making it hard to pinpoint the problem.
Although there was no guidance on the ‘use server’ directive in the Supabase documentation, I added the ‘use server’ directive yesterday due to a related error, and it worked fine then.
Am I using it incorrectly? Is it possible for something to work one day and not work the next without any code changes?