nestjs / nest

A progressive Node.js framework for building efficient, scalable, and enterprise-grade server-side applications with TypeScript/JavaScript 🚀
https://nestjs.com
MIT License
65.68k stars 7.47k forks source link

Frontend don't receving event emited in websocket adapter after upgrade #11134

Closed Lolly1150 closed 1 year ago

Lolly1150 commented 1 year ago

Did you read the migration guide?

Is there an existing issue that is already proposing this?

Potential Commit/PR that introduced the regression

No response

NestJS version

9.3.3 -> v9.3.7

Describe the regression

Better until recently my frontend received the events issued in the adapter not now, this happened after an update. Looking at the network request I found this: immagine It is http request with 200 return code

Return

42["ERROR",{"error":"Invalid jwt token.","message":"Invalid jwt token."}]44{}

Minimum reproduction code

https://github.com/Lolly1150/nestjs-minimal-reprodution

Input code

//Code in frontend(next js)
socket.on(Events.ERROR, (err) => {
console.log(err)
})
//Code in backend for emit event
return next(
 socket.emit(
   Events.ERROR,
   new WsException(Constrants.ErrorConnectGateway.Invalid)
   ),
   socket.disconnect()
);

Expected behavior

I expected the error to be printed in console

Other

No response

Flusinerd commented 1 year ago

I expected the error to be printed in console

Hi, I can't get the error to show up in the browsers console using NestJS Version 9.3.3. I used your reproduction repo and pinned the dependency-versions of nestjs to version 9.3.3 and the socket.io version to 4.5.4, which is the one that was used in 9.3.3 acording to the changelog (see #11062, which was introduced in version 9.3.4).

In both cases nothing is logged in the frontend console and the responses are identical, as you have provided. Since you provided a compiled version of your frontend it is really hard to debug. The response from the socket gateway looks correctly formatted according to the socket.io protocol (more here)

Lolly1150 commented 1 year ago

I'll update minimal reproduction with not builded minimal frontend (Note: To play this bug you do not need to have cookies on localhost:3000)

Lolly1150 commented 1 year ago

Hi, I can't get the error to show up in the browsers console using NestJS Version 9.3.3.

Updated

Lolly1150 commented 1 year ago

I tried debugging it and this information came up:

Event if output in gateway.ts function if output in adapter no

I tried to output other events with other names in the adapter but they are not received.

I think it’s an adapter problem

Flusinerd commented 1 year ago

Okay, I managed to trace it down. It is not a bug but a mistake on your part. You passed the

socket.emit("ERROR", new WsException("ERROR")),
socket.disconnect()

part to the next callback. You should do it before calling the next middleware:

createIOServer(port: number, options?: any) {
    const server = super.createIOServer(port, options);
    server.use(async (socket: AuthenticatedSocket, next) => {
      const { cookie: clientCookie } = socket.handshake.headers;
      if (!clientCookie) {
        console.log("NO COOKIE");
        socket.emit("ERROR", new WsException("ERROR"));
        socket.disconnect();
        return next();
      }

      next();
    });
    return server;
  }

You can also pass errors down the middleware to throw a connect_error event on the client side. You can read more here

There is another problem with your frontend, that you listen to late for the WS-Events, and miss the messages.