T
tRPC

❓-help

"Fast Refresh" messing with my WebSocketServer in Next.js development

Ppjnicolas7/25/2023
I got my websockets up and running in tRPC + Next.js with this code:
import { WebSocketServer } from 'ws'
import { applyWSSHandler } from '@trpc/server/adapters/ws'

// [...]

const wss = new WebSocketServer({
port: 3001,
})

const handler = applyWSSHandler({
wss,
router: appRouter,
createContext,
})
import { WebSocketServer } from 'ws'
import { applyWSSHandler } from '@trpc/server/adapters/ws'

// [...]

const wss = new WebSocketServer({
port: 3001,
})

const handler = applyWSSHandler({
wss,
router: appRouter,
createContext,
})
...and it's working like a charm. But when I change something in any server file and reload my webapp, I get this error in my server console:
WebSocket Server error Error: listen EADDRINUSE: address already in use :::3001
[...]
WebSocket Server error Error: listen EADDRINUSE: address already in use :::3001
[...]
So I guess Next.js is re-running the files and trying to re-create the server. Is there any way I can prevent Next.js of doing that? Or is there any way to close de server just before the hot-reload? Am I doing something wrong, or is there any other possible solution? Thanks!
AApteryx7/26/2023
I use tRPC websockets with next.js as well, if you're still having issues ill be happy to share my solution, there are a few steps required to set it up tho
Ccrapthings7/31/2023
hello how to make websocket work with next.js trpc? can i use socket.io ?
AApteryx7/31/2023
why would you use socket.io if youre gonna use trpc?
Ccrapthings7/31/2023
maybe a high level features like room etc?

Looking for more? Join the community!

Recommended Posts
t3-turboHey anyone know how to integrate clerk into t3-turbo appavoiding used more hooks than previous renderI understand whats causing the error in my code, im checking if id is defined before calling useQuerHow would batching result in a single database query?On the `httpBatchStreamLink` docs it says that multiple query calls could result in a single databasTS error cause Query is not returning correct type to the client!So Ive build a query which return a type called Employee, for example. on my client I've props whichTypescript helper for router outputis there a helper to do this better? Get the output for a certain route? Or is this the way to do itAm I able to use "multer" with trpc?Im currently trying to implement file uploads within a T3 app using S3. I am following along with a Losing type inference in vs-codeHey, I'm having quite some trouble with type inference today. I create my client inside of functionHow would you implement basic auth session tokens with tRPC?I'm building a hobby app which requires basic auth. I'm used to use **express **and **express-sessioExample for tRPC, stable version, with RSCHi This may be a stupid question... The readme of the experimental example mentions > Note You Dynamic return typeIs there any way to have dynamic return type with tRPC? Simple example: If I provide x: true on boSometimes invalidate not work...hello sometimes invalidate method does not work in `onSuccess` anyone same? using NextJS, pnpmtrpc client request size limits?I am sending a pretty sizable request and am seeing ``` [TRPCClientError: JSON Parse error: Unexpec