Usage of trpc with nextjs ssg
Hi, I'm trying to use TRPC with next app router SSG.
Specifcially I want to have blog page that is statically generated, but I also need to handle cookies and headers on different API routes.
How should I go about this when creating contexts and routers?...
best strategy for handling global trpc errors on the client
I’m using trpc in my nextjs app. In one of my procedures, I check if a server is banned. If it is, I throw a
TRPCError with code FORBIDDEN and a custom message:
```ts
const guildIsBanned = await ctx.db.guildBotBans.findFirst({
where: { guildId: input.guildId },
});...Debug httpBatchStreamLink in DevTools
I'm not super familiar with
chunked, but it seems to me like Chrome (in my case) won't store the result of the request to be shown in the Network tab in devtools.
This is making debugging very painful.
Can I do anything about this while still being able to stream the response?...
TS error regarding inferred type of 'appRouter'
Hey there,
I've been running into this issue with my turborepo. I have an api (hono) backend and a nextjs frontend and both rely on tRPC in order to function/make calls. I believe this is an issue with trpc/server and zod? But honestly everything I find online isn't quite right.
I have a pretty standard setup that I think I have used before with no issues. I use Zod in multiple places in my repo but I make sure that they are all the same version. I'm not 100% sure of which code to show so please do ask for anything you need to see in the comments....
Shorten /app/api/trpc/[trpc]/route.ts
The docs suggest
/app/api/trpc/[trpc]/route.ts to register the tRPC handler in a Next.js project.
Can I shorten this to e.g. /app/api/route.ts?
If yes, what's the endpoint that I need to pass to fetchRequestHandler and what's the url I need to pass to httpBatchLink?...Stream error polluting sentry - only on Safari
Hi we are using TRPC subscriptions for streaming the LLM response. We've started seeing on error on sentry related to
AbortError
abort pipeTo from signal.
This errors only happens on safari <16.4, so it matches the chat gpt explanation.
...
Setting up tRPC without breaking Frontend's typechecking
Hello everyone,
I would like to better understand how I can setup my project correctly. Right now I'm using Fastify with tRPC. My frontend is a React Native app. Both live in a monorepo using yarn workspaces.
I'm exporting my tRPC types like this:...
Invalidate all queries in new TanStack React Query Setup
Hey, I set up the new tRPC flow for Next.js using TanStack React Query from docs:
https://trpc.io/docs/client/tanstack-react-query/setup
How can I add to it, previously implemented and documented (https://trpc.io/docs/client/react/useUtils#invalidate-full-cache-on-every-mutation ) queries invalidation on every mutation in app?
We don't use the
createTRPCReact anymore and I can't seem to find any other method from the docs where I can pass these overrides :x Thanks!...hono, next.js ssr & better-auth cookies
hey guys, I am currently trying to use Better Auth with tRPC server side with a hono backend.
In my backend, I am checking for the session like this:
const session = await auth.api.getSession({ headers: c.req.raw.headers });
in my trpc batchLink, I just tried to put headers like this:...Deduplicating identical queries in tRPC httpBatchLink (standalone server + Next.js server-side)
Hey folks, I'm running into an issue with tRPC v11 where my standalone tRPC server is called from Next.js 15 server-side using a tRPCProxyClient with httpBatchLink. Batching works great for multiple different procedures, but if the same procedure with identical inputs is called multiple times in the same request (e.g., from nested components), it gets batched but not deduplicated—meaning the server still processes and responds to duplicates, which is inefficient.
Right now, I've got a simple (kinda dumb) workaround: wrapping individual procedure calls in React's cache like this:
```ts
const api = /* my tRPCProxyClient with httpBatchLink */;...
Set cookie header in procedure middleware
Hi,
I am trying to set the cookie header in my middleware "protected route" eg. whenever I decide user shouldn't be authorized anymore I would like to clear the cookie by setting
set-cookie with max-age 0.
```ts...SSE Subscriptions freeze app when multiple tabs open
So I just found out that whenever I open multiple tabs of my web app it stops working all together across all the tabs due to the subscription. Not quite sure how to debug this and find a solution for this problem.
CacheUpdateSubscriber Mounts in my root layout
apiUtils.location.findLocationsInCache is an staleTime: Infinite query
...Error: Could not find source file for path
When I start nx serve server, I get an error:
Error: Could not find source file for path directory\apps\server\src\app\app.module.ts,
make sure "sourceMap" is enabled in your tsconfig.
```...
tRPC on pages router broken after Next 15.5.x
A fresh project created with
bunx create-t3-app@latest fails to build with the error:
```bash
pages-router on main [+] via v22.11.0 λ bun run build
$ next build...
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....