T
tRPC

Is it ok to use a createCaller() router within ServerSideProps?

Is it ok to use a createCaller() router within ServerSideProps?

Ddenik1981
View on Discord
1/25/2023
The official trpc docs shown an example of how to use the SSGHelper router within SSPs. The procedure I wanna use needs the session object within the context. This procedure is shared by the public API trpc router thus I wouldn't want to create a different procedure that will do the same but taking the session information from someplace else. I was able to create a server side only router with createCaller and tne innerContext as suggested and it is working perfectly inside SSPs. Is there any CAVEAT regarding using this type of reouter instead the SSG provided. I do understand that I won't be able to prefetch and hydrate the page, but apart from that, is there anything that I should be aware of. My particular use case was not feeding props into the page but to get a value from the user procedure that wil later allow to redirect to another path. This is working great with the SSO router but I'm planning to use it later for a traditional SSP props feed operation. To add more context to the post what I'm basically doing is: In the server 
// server - appRouter is the API trpc router

export async function createContextInner(opts: CreateInnerContextOptions) {
  return {
    session: opts.session,
  };
}

export type Context = inferAsyncReturnType<typeof createContextInner>

export const caller = async (ctx: Context) =>
  appRouter.createCaller(await createContextInner(ctx));
// server - appRouter is the API trpc router

export async function createContextInner(opts: CreateInnerContextOptions) {
  return {
    session: opts.session,
  };
}

export type Context = inferAsyncReturnType<typeof createContextInner>

export const caller = async (ctx: Context) =>
  appRouter.createCaller(await createContextInner(ctx));
In ServerSideProps 
export async function getServerSideProps(ctx: GetServerSidePropsContext) {
  const session = await unstable_getServerSession(
    ctx.req,
    ctx.res,
    authOptions
  );

  const c = await caller({ session });

  // this procedure use the session context object
  const user = await c.user.me();

  return session
    ? { redirect: { permanent: false, destination: `/${user.type}/member` } }
    : { props: {} };
}
export async function getServerSideProps(ctx: GetServerSidePropsContext) {
  const session = await unstable_getServerSession(
    ctx.req,
    ctx.res,
    authOptions
  );

  const c = await caller({ session });

  // this procedure use the session context object
  const user = await c.user.me();

  return session
    ? { redirect: { permanent: false, destination: `/${user.type}/member` } }
    : { props: {} };
}

Looking for more? Join the community!

T
tRPC

Is it ok to use a createCaller() router within ServerSideProps?

Join Server
Recommended Posts
tRPC Cors Authentication ErrorHey, I was mainly looking to enable CORS locally for calling my tRPC endpoints in localhost:3000 (NeDemo code `trpc.infinitePosts.add` on infinitedQuery not workingDoc here: https://trpc.io/docs/useInfiniteQuery#getinfinitedata, I created an my query like this: ``NextJS + TRPC + NXi have a nextjs application inside a NX monorepo. i have everything for @trpc/server inside a node lGlobal context or shared context.We are using react query and trpc and we ran into a undesired effect I hope someone could help me wi