How to do web socket handshake?

[narrow leaf]

<@&1004656351647117403> please have a look, thanks.

I uploaded your attachments as Gist. This makes them more accessible, for example to mobile users.

[regal locust]

what is the error?

[dim finch]

i get this error when i use this - const socket = new SockJS("http://localhost:9999/ws");

localhost:9999 is the port number of my api gateway.

and then i get this error when i use this line - const socket = new WebSocket("ws://localhost:9999/ws"); the backend has withSockJs in the web socket configuration file.

and this is the error in spring boot gateway service. check the text file

[narrow leaf]

I uploaded your attachments as Gist. This makes them more accessible, for example to mobile users.

[dim finch]

I have one question - should i use SockJS or WebSocket in react app? if i use sockjs i will have to do withSockJs in spring boot web socket config file. if i don't use it then i will not put that withSockJs() there.

---

the only way it works is if i do the following -

import Stomp from "stompjs";

let socketClient: any = null;

export function connectSocket(token: string) {
  const socket = new SockJS("http://localhost:8085/ws");
  socketClient = Stomp.over(socket);
  socketClient.connect(
  { Authorization: `Bearer ${token}` },
  () => console.log("Connected to WebSocket"),
  (error: Error) => console.error("WebSocket connection error:", error),
);

}

export function getSocketClient() {
  return socketClient;
}

    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/ws")
                .setAllowedOriginPatterns("http://localhost:5173")
                .withSockJS();
    }```

The way this one works is if i directly access the notification service (without using gateway (port number of gateway is 9999)). 
*I have attached the output screen for your reference.*

[narrow leaf]

Detected code, here are some useful tools:

Formatted code

import SockJS from"sockjs-client";
import Stomp from"stompjs";

let socketClient : any = null ;
export function connectSocket(token : string) {
  const socket = new SockJS("http://localhost:8085/ws");
  socketClient = Stomp.over(socket);
  socketClient.connect({
    Authorization : `Bearer${
      token}
    `}
  , () =  > console.log("Connected to WebSocket"), (error : Error) =  > console.error("WebSocket connection error:", error), );
}
export function getSocketClient() {
  return socketClient;
}

[dim finch]

for your reference, what i have used so far -

• consul for service discovery
• spring boot
• spring cloud
• jwt
• microservices

[regal locust]

https://stomp-js.github.io/stomp-websocket/codo/extra/docs-src/Usage.md.html

why not just use stomp only?

[dim finch]

the problem is not with the client. the problem is that the gateway doesn't send a response to the websocket request.
i always get these errors in backend - io.netty.handler.codec.http.websocketx.WebSocketClientHandshakeException: Invalid handshake response getStatus: 403
or invalid upgrade header

I switched to using a simpler microservices consul project containing only gateway config service and notification service with a simpler frontend. it doesnt have jwt auth or anything complex. Still i get the same error (mentioned above).

[dim finch]

i used this approach and i get this in frontend

and this in gateway service -

this is the yml file. what could be wrong?
and this is the project structure of gateway service.

[narrow leaf]

I uploaded your attachments as Gist. This makes them more accessible, for example to mobile users.

[dim finch]

2025-08-13T09:49:38.787+05:30  WARN 2068 --- [gateway-service] [ctor-http-nio-4] reactor.netty.channel.FluxReceive        : [096c7614-1, L:/10.20.59.139:49584 ! R:/10.20.59.139:8080] An exception has been observed post termination, use DEBUG level to see the full stack: io.netty.handler.codec.http.websocketx.WebSocketClientHandshakeException: Connection prematurely closed BEFORE opening handshake is complete.``` this is also a part of the error i shared before.

[narrow leaf]

@dim finch

Your question has been closed due to inactivity.

If it was not resolved yet, feel free to just post a message below
to reopen it, or create a new thread.

Note that usually the reason for nobody calling back is that your
question may have been not well asked and hence no one felt confident
enough answering.

When you reopen the thread, try to use your time to improve the quality
of the question by elaborating, providing details, context, all relevant code
snippets, any errors you are getting, concrete examples and perhaps also some
screenshots. Share your attempt, explain the expected results and compare
them to the current results.

Also try to make the information easily accessible by sharing code
or assignment descriptions directly on Discord, not behind a link or
PDF-file; provide some guidance for long code snippets and ensure
the code is well formatted and has syntax highlighting. Kindly read through
https://stackoverflow.com/help/how-to-ask for more.

With enough info, someone knows the answer for sure 👍

[narrow leaf]

@dim finch

Your question has been closed due to inactivity.

If it was not resolved yet, feel free to just post a message below
to reopen it, or create a new thread.

Note that usually the reason for nobody calling back is that your
question may have been not well asked and hence no one felt confident
enough answering.

When you reopen the thread, try to use your time to improve the quality
of the question by elaborating, providing details, context, all relevant code
snippets, any errors you are getting, concrete examples and perhaps also some
screenshots. Share your attempt, explain the expected results and compare
them to the current results.

Also try to make the information easily accessible by sharing code
or assignment descriptions directly on Discord, not behind a link or
PDF-file; provide some guidance for long code snippets and ensure
the code is well formatted and has syntax highlighting. Kindly read through
https://stackoverflow.com/help/how-to-ask for more.

With enough info, someone knows the answer for sure 👍