tRPC

T

tRPC

Move Fast & Break Nothing. End-to-end typesafe APIs made easy.

Join

Blob as response tRPC v.11

Hi! According to https://trpc.io/blog/announcing-trpc-v11#formdata--non-json-content-types-support it should now be possible to return blobs. How? I have not been able to make it work and i have not found any blob response examples. Of note is that we are also using the express adapter from @trpc/server/adapters/express Thanks!...

How can I access the session in fastify when using `useWSS: true`?

I've got a fastify/trpc application that looks something like this: ```typescript await using app = Fastify({ loggerInstance: logger,...
Solution:
Hi @Mr. Joker, I ended up writing my solution up on my blog, you can read that here: https://jonathan-frere.com/posts/trpc-fastify-websockets/ Specifically, the solution I found was this: ```typescript...

TRPC giving 502 errors with jsonl header

I'm encountering a 502 Bad Gateway error when making a GET request to my tRPC endpoint in a production environment. This only happens when using the trpc-accept: application/jsonl header. Environment Runtime: bun Deployment Stack: docker → nginx → cloudflare...

Benefits of trpc in tan stack

Hi all! New to trpc and was just starting using tanstack start for the first time. Was curious for those who have a bit more experience with trpc, is there any specific reason you would use it in a tanstack start app? From the start docs Tanner mentions being heavily inspired by trpc, it seems like a lot of the benefits of trpc that you get in say next, are covered by starts integration between server functions & tanstack query. ...

tRPC in a “monorepo” (server / client folders in same repo)

So i happen to have a monorepo project in a sense that it has 2 folders (server / client) in the same repo. No workspaces, no package json or tsconfig in root. Trying to setup trpc, but client tsc throws server errors, my guess is because path aliases configured in both folders tsconfig. Is there a way to setup trpc in this case, or i need to look into converting the project into a valid monorepo?...

Exposing server-side caller and tRPC caller/helper through the same export?

Hey there 👋 I'm wondering if anyone thinks it could be unwise to expose the server-side caller and the tRPC caller through the same export. ```ts // server.ts import "server-only";...

useInfiniteQuery with Tanstack Query V5

Hi all, Is there a example for useInfiniteQuery with Tanstack Query V5?...

Long Running AI Function

Hello! I have a long running function 30-40s, and 50s worst case. Its doing some AI magic. I keep getting Unable to transform response from server or stream close (httpBatchStream) when trying to execute the function. Its just a long running function, I do not need it to be streaming, just a bit longer running. Is there a way I can increase the length of which the stream closes on one TRPC mutation endpoint? Or is there some other workaround here I am not seeing?...

Cloudflare Page tRPC route

I successfully deploy on cloudflare page but however i can't access tRPC route. i'm getting error 500. are there proper setup for open-next for tRPC to work? ``` Connected to asdsad, waiting for logs... GET https://asdsadsad.workers.dev/api/trpc/public.publicProduct.getProductCategories,public.publicProduct.getFeatured?batch=1&input=%7B%220%22%3A%7B%22json%22%3Anull%2C%22meta%22%3A%7B%22values%22%3A%5B%22undefined%22%5D%7D%7D%2C%221%22%3A%7B%22json%22%3A%7B%22limit%22%3A3%7D%7D%7D - Ok @ 03/04/2025, 8:53:12 pm...
Solution:
turns out we prisma doesn't fully support Edge runtime. brb switching to drizzle. https://www.reddit.com/r/nextjs/comments/1jornyu/how_to_properly_connect_a_nextjs_to_a_database/

can i send data from client to server in subscriptions

Hi, as in the topic, is it possible to do bidirectional websockets transmission, i am trying to build a chat and cannot figure out how to send messages from my nextjs frontend using wsLink to trpc standalone backend (not in nextjs api routes). Many thanks

subscription: Cannot use 'in' operator to search for 'enabled' in undefined

``` 2025-04-02T14:22:10Z app[17814621c56328] fra [info] ⨯ TypeError: Cannot use 'in' operator to search for 'enabled' in undefined 2025-04-02T14:22:10Z app[17814621c56328] fra [info] at IndexPage (src/app/app/[appId]/setup/page.tsx:86:24) 2025-04-02T14:22:10Z app[17814621c56328] fra [info] 84 | const trpc = useTRPC(); 2025-04-02T14:22:10Z app[17814621c56328] fra [info] 85 | const { data } = useSubscription(...

Turborepo internal package exported procedure context type `any`

I am working on moving our trpc API to a separate internal package away from our next.js app, but running into an issue where the ctx type is any in the Next.js app. Even though the type is shown when I hover the procedure itself. Any idea what this could be?
No description

Finding the Unused TRPC procedure...

after a big rewrite of the frontend I'm not using all the old mutations / queries so now I have them there and I need a way to identify the unused ones ? the manual Ctr+Shif+F is taking tooo much time HHhH :feelsadman:...

Migrating pages router to app router

hey there. long time user, first time caller. I'm trying to migrate my pages router nextjs app to next app router. I'm struggling to understand some core trpc + ssr principles I think. afaik, my pages router pages were rendered server side if possible, and all useQueries came preloaded with data on render. Now I'm following along the docs here and really struggling to make things work that way. It seems I need to manually specify what components are server and which are client side. Let's start with my landing page. it has hooks like usePathname, useSearchParams, so I don't think I'm able to make the page be a server component. Hooks aren't allowed there. I'm also wrapping all my pages in a layout which includes a sidebar that highlights the active link, all of this sounds to me like I can't use it server side. I also use an animated component that uses useEffect and useState, again, no server component afaik. ...
No description

Prefetching with tRPC: Using hono.js/Express adapter and Next.js

If I use Hono.js or Express as the adapter for tRPC and my frontend is Next.js, will I be able to utilize the prefetch features referenced in Set up with React Server Components

Types question

I'm slowly migrating an old graphql based project over to trpc v11, using @trpc/tanstack-react-query, and rather liking how it all works, but I'm having some difficulties typing some of the code when I try and wrap some of the queries. I have simple code like this: ```ts...

What is the best approach when using monorepo with tTPC

What is the best approach when configuring tRPC inside of monorepo? I would like it to be used in Next.js, I create an internal library for tRPC example packages/api so I can call it anywhere in monorepo, now I would like to know where exactly is the best place for the client.tsx and for the tRPC caller for Server Components which is the server.tsx can I place it also inside of the internal library of tRPC or I will place it inside of Next.js which is on apps/web.

Troubleshooting createTRPCOptionsProxy with Server Components and Context Passing

How does createTRPCOptionsProxy work in server components? I'm creating a context that passes the hono context to createTRPCContext in order to obtain the HTTP headers, since I need to forward those headers to the better-auth API to get the session I use @hono/trpc-server which created by the hono so I can use hono as adapter of trpc. ```...
No description

Integrating hono.js with tRPC in Next.js: Routing and Context Considerations

I want to combine Hono.js with tRPC. I followed the guide on the 3rd party middleware made by hono for a tRPC server, and now I have set up the hono tRPC server 3rd party middleware similar to the code below: ```ts import { Hono } from 'hono' import { trpcServer } from '@hono/trpc-server' // Deno 'npm:@hono/trpc-server'...
Solution:
Option 1. N -> H -> T (this is to use src/app/api/[[...route]) as the example below Option 2. N -> T - You use the tprc adapter for nextjs directly and src/app/api/trpc/[trpc]/route I think you might missunderstanding what's the purpose goal of HonoJS, vs nextjs api/server and how they interact with TRPC...

httpStreaming with NonJsonSerializable

i have a question lets say i have this link setup to make httpStreaming work and also make NonJsonSerializable stuff work (formdata) if in the mutation i return json it works perfectly but if i return an stream i get Cannot use stream-like response in non-streaming request which makes sense but is there any way of making it work?...
No description