Wildhide
TTCTheo's Typesafe Cult
•Created by Wildhide on 7/11/2023 in #questions
TRPC server side prefetching not working properly
I have tried to fix this bug for a while now and I literally do not know what to search for anymore. I don't know if it is a bug with the T3 stack as a whole or just TRPC.
On my user profiles I have a createdAt field which is supposed to be a datetime field. I want to prefetch this in my user profile page.
import superjson from "superjson";
export const getServerSideProps: GetServerSideProps = async (ctx) => {
const session = await getServerAuthSession(ctx);
const ssg = createServerSideHelpers({
router: appRouter,
ctx: { prisma, session },
// transformer: superjson, // optional - adds superjson serialization
});
if (session === null) {
return {
props: { trpcState: { session: null } },
};
}
const userData = await ssg.profile.getByIdPrivate.fetch({
userId: session.user.id,
});
console.log("userData", userData);
await ssg.profile.getByIdPrivate.prefetch({
userId: session.user.id,
});
console.log("getServerSideProps prefetchResult", ssg.dehydrate()); // to inspect prefetch result
return {
props: {
trpcState: ssg.dehydrate(),
userId: session.user.id,
username: session.user.name,
} as const,
};
};
if I don't use superjson I get this error
Error: Error serializing
.trpcState.queries[0].state.data.createdAt returned from getServerSideProps in "/profile".
Reason: object ("[object Date]") cannot be serialized as JSON. Please only return JSON serializable data types.
But if I do my server side prefetching does't work. I hit the loading state in my query
It seems to me that this is a issue relating to superjson not working properly. I don't know how to fix it anymore5 replies