implict Server functions
Unanswered
Ocicat posted this in #help-forum
OcicatOP
import { db } from "@/backend/database/drizzle/db";
import { userAddresses } from "@/backend/database/schema/schema";
import { eq } from "drizzle-orm";
export const fetchUserAddresses = async (userId: string) => {
const isServer = typeof window === "undefined";
if (isServer) {
console.log("Running on the server");
} else {
console.log("Running on the client");
}
try {
const existingUserAddresses = await db.query.userAddresses.findMany({
where: eq(userAddresses.userId, userId),
});
return existingUserAddresses;
} catch (error) {
console.log("Error fetching userAddresses", error);
throw new Error("Error fetching userAddresses");
}
};So, judging by the console.log, this function runs on the server. Evidently, that makes sense. What I don't understand is that I haven't explicitly labeled it with the "use server" directive.
How does Next.js decide whether this standalone function should run on the server or on the client? Notice this function is not declared under the src/app folder, nor is it part of an API route.
Thanks in advance! for your help
22 Replies
Sun bear
From my understanding it will be executed where it is loaded.
E.g. you use it in a server side page.tsx then it will run serverside.
If you declare the page.tsx client side then you will probably get an error.
I would declare the file as "use server" anyway to make sure its also working when you run it in a client component eg as mutation
E.g. you use it in a server side page.tsx then it will run serverside.
If you declare the page.tsx client side then you will probably get an error.
I would declare the file as "use server" anyway to make sure its also working when you run it in a client component eg as mutation
OcicatOP
@Sun bear , thanks.
1. But client components can call server fucntions. So theoretically it shouldn' t throw, should it?
I'm going to try it out.
2. I have two options:
. call it from a server component and then share the result via context.
. call if from the client component which needs it - ft 'll be 1, 2 compoennts , at the most. This absolutely must be a client compoent.
1. But client components can call server fucntions. So theoretically it shouldn' t throw, should it?
I'm going to try it out.
2. I have two options:
. call it from a server component and then share the result via context.
. call if from the client component which needs it - ft 'll be 1, 2 compoennts , at the most. This absolutely must be a client compoent.
@Ocicat <@908094633660268555> , thanks.
1. But client components can call server fucntions. So theoretically it shouldn' t throw, should it?
I'm going to try it out.
2. I have two options:
. call it from a server component and then share the result via context.
. call if from the client component which needs it - ft 'll be 1, 2 compoennts , at the most. This absolutely must be a client compoent.
Sun bear
1. Is true. But I think if you dont label it "use server" then it wont work from a client component. At least thats what I figured out when I remember correctly
OcicatOP
@Sun bear , will report back!
OcicatOP
@Sun bear , can confirm that it throws an error in the absence of "use server" directive, just like you predicted.
Cheers!
Cheers!
Nope, "use server" directive is not meant to be used for that case
that is for the server actions
OcicatOP
@James4u , thanks.
Can I still call fucntions marked with "server only" from client -components? Or "can server only" functions only be called by other server-exclusive functions?
So "use server" tells Next.js to create an API route under the hood - did I get that right?
Thanks for your time!
Can I still call fucntions marked with "server only" from client -components? Or "can server only" functions only be called by other server-exclusive functions?
So "use server" tells Next.js to create an API route under the hood - did I get that right?
Thanks for your time!
well @Ocicat 'use server' is for server actions not API routes. API routes are server only by defualt, no?
server only prevent server only codes get imported to the client codeOcicatOP
@James4u , I've been calling server actions - "use server" functions - from client components with success. I seem to recall these are created via API POST routes under the hood, i. e., not publcily exposed.
OcicatOP
No, I'm calling these "use server" functions directly from client components, let's say, from an onClick. So far it's working. When I ommited the "use server" directive, it threw an error, which ammounted to Node trying to use server-exclusive resources on the client
it's obvious
server code is going to be excuted in the client end
@Ocicat No, I'm calling these "use server" functions directly from client components, let's say, from an onClick. So far it's working. When I ommited the "use server" directive, it threw an error, which ammounted to Node trying to use server-exclusive resources on the client
what do you do exactly in that function?
OcicatOP
@James4u , it retrieves user addresses from the db
then it can't be called from the client component
server side data fetching is only available in server components
OcicatOP
@James4u , it's being called from a cleint component and it's working. The fucntion is lablled with "use server" and it's called from a cleint component via onClick() event handler.
It's working.
It's working.