How to use `localLink` (`unstable_localLink`)
This is more of a guide, rather than a question since I've found no docs on how to use this function to fix SSR related issues.
So, based on https://orpc.unnoq.com/docs/best-practices/optimize-ssr I've managed to cook something that has fixed my issues with the headers not passed to the requests on initial SSR of "use client" components (nextjs).
So, in my
trpc/server/index.ts (usually server.ts) I added the following:
```ts
globalThis.$getTRPCServerSideTerminatingLink = () => unstable_localLink({...tRPC sends duplicate header
i tried setting up a reverse proxy for my NextJS + tRPC app using those 3 options:
- nginx
- traefik
- caddy
...
Customizing the TRPCError type
I can't find anything in the docs about customizing the TRPCError type if I need to transmit extra properties etc along with the errors, or adding custom error codes. Can I amend the TRPCError type with my own interface?
What is the "correct" way to do this?...
Output validator for Async generators on a streaming procedure using Zod
Might be a bit of a long shot but I was curious if anyone else has managed to do this?
Im just getting typescript errors as it wants the query return type to be a
MaybePromise<T> when I have AsyncGenerator<T> and there doesnt seem to be anything in zod (apart from brute forcing through custom, which defeats the purpose) to make this work.
Keen to here anyones thoughts!
```...traefik reverse proxy with trpc
i set up traefik as a reverse proxy for my nextjs app which uses trpc, but when requests are being forwarded they fail with this error:
500 Internal Server Error error="net/http: HTTP/1.x transport connection broken: too many transfer encodings: [\"chunked\" \"chunked\"]"Get procedure path programatically?
Is it possible to get the path the procedure was called by programatically?
I don't think it's possible to use anything like ctx.req.url when batching is enabled....
How to make sure I don’t bundle my entire backend into my web app?
I’m surprised that I don’t see more people talking about this.
Did anyone succeed at file upload with the fastify adapter?
Hi there,
I spent literally hours trying to figure out how to get file upload with multipart/form-data working using the fastify adapter. I couldn't get it to work.
The docs (https://trpc.io/docs/server/non-json-content-types) specifically tell not to handle multipart beforehand, which is why I didn't register @fastify/multipart before registering the tRPC plugin. This however leads to Fastify rejecting multipart as non-parseable, so I tried the following:
...
sanitizing output based on output schema
As i understand, the
.output will only ensure the schema is respected, but will not sanitize output on the go (even tho it could be possible with a z.strictObject()):
```ts
.output(someSchema) // <- does not sanitize data
// ---...middleware executed twice? should i use `experimental_standaloneMiddleware`?
I'm trying to build something like this:
1. a session middleware which reads request cookie, extract userId and pass in ctx.session
2. a permissions middleware which should pick the userId from the ctx.session and exposes user permission in ctx.session
...
how to best test trpc?
does programs like postman not work well with trpc? if i wanted to test my trpc server by making requests, what the best way to do that?
tRPC v11 with Tanstack React Query - queryOptions/mutationOptions methods missing
I'm migrating to the new Tanstack React Query integration for tRPC v11 in a Next.js 15 monorepo, but the
queryOptions and mutationOptions
methods are not available on my tRPC utilities.
Setup:
- Next.js 15.3.5 with App Router...How to display server router docs on the client hover
is there a way to place ts docs an server router endpoints and have it show on the client side.
```ts
export const helloRouter = createTRPCRouter({
/**
* Says hello to a user...
Tanstack React Query and TRPC package version incompatibility
I updated the TRPC and Tanstack packages to their latest versions.
```
-"@tanstack/react-query": "^5.80.2",
-"@trpc/client": "11.2.0",...
tRPC + Nextjs: redirect on next error with new TanStack Query integration
Using a tRPC middleware like this that throws a Nextjs error:
`export const withSessionProcedure = t.procedure
.use(timingMiddleware)
.use(({ next, ctx: { session, ...rest } }) => {...
Nextjs, Expo react native, Trpc Help
I’m working on a Next.js 15 app using tRPC with the following packages:
@trpc/client: ^11.4.3
@trpc/server: ^11.4.3...
Is it possible to use tRPC with Deno over Websockets only?
I guess this is NodeJS: import ws from 'ws';
and apply WSSHandler requires it as in the example here:
https://trpc.io/docs/server/websockets
I was wondering if there is a way to run it with Deno (not in compatibility mode because it's not recommended for production)....
Tprc Tanstack integration types
Hello guys! I wanted to create a reusable query, like this:
export function useProjectBySlug(slug: string, options?: any) {
const queryOptions = trpc.projects.getBySlug.queryOptions({ slug }, options);
return useSuspenseQuery(queryOptions);
} ...Migrating v11 from classic client to TanStack Query: “Error: experimental_prefetchInRender feature ”
My code was working using the classic React client, but the shiny new feature set promised virility and good looks. But when I call useQuery() on my API, it's returning a rejected promise with the error message "Error: experimental_prefetchInRender feature flag is not enabled". Why does it think I requested a prefetch, and how do I correct the code so it doesn't request a prefetch?
I asked Copilot and got this response:
...
types not working if input provided
Hey guys, just getting into tRPC: If i add a input to a query, in the client, the types are not working anymore. thats normal? is there any way around this?