Theo's Typesafe CultTTC
Theo's Typesafe Cultโ€ข3y agoโ€ข
55 replies
cidit

im having trouble setting up trpc w/ websockets on latest t3...

... and i cant find a recent enough example at all!

TLDR: has anyone made it work on the most recent version of create-t3? if so, how? could i be linked a repo to see how it's done?

these are the two examples i found:
- one from the trpc doc https://github.com/trpc/examples-next-prisma-websockets-starter/blob/main/src/server/wssDevServer.ts
- this one i cant remember where i found it: https://github.com/fimbres/t3-live-chat/blob/main/package.json

my understanding of the steps that are supposed to work:
- you setup the wsslink in src/server/utils/api.ts
- you make a wsServer.tsx file that:
- defines a ws.Server
- applies a wssAdapter to the approuter defined in src/server/api/root
- is a standalone server independendent from the next server
- you start the next server
- you start the websocket server (i tried with the commands in the package.json of both of the repos i linked above)
- the trpc on the frontend of next is going to point to the websocket server
- magic your trpc calls are now passed through websocket instead of HTTP

but this is what i get instead: (link: picture)

im gonna stop pulling my hair and take a break, and then i'll make a public repo with a 1:1 recreation of the steps i took on the private project im working on.
image.png
GitHub
๐Ÿ“ tRPC Next.js WebSocket Starter. Contribute to trpc/examples-next-prisma-websockets-starter development by creating an account on GitHub.
examples-next-prisma-websockets-starter/src/server/wssDevServer.ts ...
GitHub
This is a project about a chat with real time functionality, implementing private and public rooms, developed with the T3 Stack for full-stack typescript development and websockets. - fimbres/t3-l...
t3-live-chat/package.json at main ยท fimbres/t3-live-chat
Was this page helpful?