MadaShindeInai•3mo ago

Prefertch() privateProcedure (Clerk) in gSSP

Trying to do that I'm getting "UNAUTHORIZED" error. I see that for creating prefetchHelper I use createInnerTRPCContext without passing auth data to it. Does it mean that it is impossible to fetch data from privateProcedure using prefetchHelper ? Or there are some recomendations how to do this with tRPC? (I know that I can just do Clerk auth check and make Prisma call after, but I want this data to be cached and passed to React-Query)

prefetchHelper.ts
export const prefetchHelper = createServerSideHelpers({
  router: appRouter,
  ctx: createInnerTRPCContext({}),
  transformer: superjson, // optional - adds superjson serialization
});

prefetchHelper.ts
export const prefetchHelper = createServerSideHelpers({
  router: appRouter,
  ctx: createInnerTRPCContext({}),
  transformer: superjson, // optional - adds superjson serialization
});

trpc.ts
export const createInnerTRPCContext = ({ auth, req }: AuthContext) => {
  return {
    auth,
    req,
    prisma,
    resend,
  };
};

export const createTRPCContext = (opts: CreateNextContextOptions) => {
  return createInnerTRPCContext({
    auth: getAuth(opts.req),
    req: opts.req,
  });
};

trpc.ts
export const createInnerTRPCContext = ({ auth, req }: AuthContext) => {
  return {
    auth,
    req,
    prisma,
    resend,
  };
};

export const createTRPCContext = (opts: CreateNextContextOptions) => {
  return createInnerTRPCContext({
    auth: getAuth(opts.req),
    req: opts.req,
  });
};

1 Reply

MadaShindeInai•3mo ago

Ah, I needed to pass "auth" from gSSP to prefetchHelper. Works.

type getPrefetchHelperArgs = {
  auth: Parameters<typeof createInnerTRPCContext>[number]["auth"];
};
export const getPrefetchHelper = ({ auth }: getPrefetchHelperArgs) => {
  const prefetchHelper = createServerSideHelpers({
    router: appRouter,
    ctx: createInnerTRPCContext({ auth }),
    transformer: superjson, // optional - adds superjson serialization
  });
  return prefetchHelper;
};

type getPrefetchHelperArgs = {
  auth: Parameters<typeof createInnerTRPCContext>[number]["auth"];
};
export const getPrefetchHelper = ({ auth }: getPrefetchHelperArgs) => {
  const prefetchHelper = createServerSideHelpers({
    router: appRouter,
    ctx: createInnerTRPCContext({ auth }),
    transformer: superjson, // optional - adds superjson serialization
  });
  return prefetchHelper;
};