Next.js Discord

Discord Forum

Error: Invariant: cookies() expects to have requestAsyncStorage, none available.

Answered
Jenn posted this in #help-forum
Open in Discord
JennOP
I encountered this error while trying to deploy this on vercel. It works on the Localhost but it that error shows on the vercel deployment.

okay, I figured out where the problem is and it is from here: 
//at the top of this code
import { createClientComponentClient, createServerActionClient, createServerComponentClient} from "@supabase/auth-helpers-nextjs";
import { cookies } from "next/headers";

const cookieStore = cookies()
const supabase : any = createServerActionClient({ cookies: () => cookieStore })

export async function fetchWaterStationOfUSer(user_id: string) {

    try {
        console.log(user_id, "user id from the data.ts")
        const { data, error, status } = await supabase
        .from('water_refilling_station')
        .select()
        .eq('user_id', user_id);
  
      if (error && status !== 406) {
        throw error;
      }
  
      // Check if a water station was found for the user
      const water_station = data && data.length > 0 ? data[0] : null;
  
      return water_station;
    } catch (error) {
      console.error('Database error', error);
      throw new Error('Failed to fetch water refilling station data');
    }
  }
Answered by Eric Burel
const cookieStore = cookies()
const supabase : any = createServerActionClient({ cookies: () => cookieStore })
View full answer

15 Replies

JennOP
And then the fetchWaterStation is used here: 
   //check if the user has a water station
   check if the user has a water station
    let waterStation; 
    if(user){
      const userId = user?.id ? user.id : null;
      console.log(user.id, "user_id from the water types")
      if(userId != null){
        waterStation = await fetchWaterStationOfUSer(userId)
      } else {
        //handle the situation when userId is null
        console.log('user id is null')
      }
    } else{
      // handle the situation when user is not defined
      console.log('user is not defined')
    }
When I chose not to use this part of the code, the build on vercel would work fine. I would still like to know what caused this error and how to fix it"
Eric Burel
You can't call cookies() top level
because it is scoped to the current HTTP request
so only available within an RSC or a route handler or middleware, that are themselves triggered by an HTTP request
Eric Burel
const cookieStore = cookies()
const supabase : any = createServerActionClient({ cookies: () => cookieStore })
Answer
Eric Burel
you need to move that within the function
if you are worried that the supabase store is generated for each call, it's because you need "cache"
so smth like
const rscSupabaseClient = cache(() => {
const userId = cookies().get("token")
return createYourSupabaseClient(userId)
}
and then your "rscSupabaseClient" is safe to use: it creates one client per user request, and caches it so you can call it in any RSC
if you need to share the supabase client between multiple requests, it's a tad trickier, you need to setup another layer of caching like with "node-cache" or global variables
unstable_cache will cover that most probably but... it's unstable
@Eric Burel const cookieStore = cookies() const supabase : any = createServerActionClient({ cookies: () => cookieStore })
JennOP
Oh okay. So every function I have that I need supabase, then I would need to create the const cookie and supabase