Socket IO Server is Sending Messages But Client is not Receiving the Message

[marmon179]

1)I have a Socket IO Server implemented in Spring Boot. When the server sends an event I inspected this in the Chrome Network tab and I discovered that the events are really being sent, but my react js client is not logging the events that were sent. What could be wrong.

2)On the Network tab in Chrome, I see that whenever the server sends a message, it arrives, but the code below doesn't work.

3)Server: JAVA netty-socketio 1.7.7 Client: socket.io client(I tried different versions from 1* to the latest 4*)

4)Here are the messages as seen under the Network tab on Chrome

3)I call a hook in a component for the test, I want to display a message on the console

   `const { events } = useRealtime<any>({
      event: 'signalEvent',
      onEvent: (data) => {
      console.log('data', data);
      setSocketData(data);
       },
        });`

4)Here is my connection client:

  `  export function useSocketIO(url: string) {
     const ioRef = useRef<Socket>();
     const [connected, setConnected] = useState(false);

    useEffect(() => {
        ioRef.current = io(url, {
       transports: ['websocket'],
       query: {
       username: StoreAuthController.username,
     },
     });
     ioRef.current.on('connection', () => {
      console.log('WS Connected to', url);
     setConnected(() => true);
   });

  ioRef.current.on('disconnect', () => {
    console.log('WS disconnected');
     setConnected(() => false);
   });

   return () => {
    console.log('WS destroyed');
    ioRef.current?.close();
  };
   }, [url]);

  return {
  io: ioRef.current,
  connected,
 };
  }`

6)A custom hook for calling from different components

      `   export type RealtimeOptions<T> = {
         event: string;
         onEvent?: (data: T) => void;
            };

         export type CollectionService<T> = {
         options: RealtimeOptions<T>;
         events: Array<T>;
         send: (data: T) => void;
         emit: (event: string, data: T) => void;
           };

          const DEFAULT_URL = import.meta.env.VITE_HOST_SOCKET;

          export function useRealtime<T>(options: RealtimeOptions<T>): CollectionService<T> {
          const [url] = useState(DEFAULT_URL);
         const { io } = useSocketIO(url);
         const [events, setEvents] = useState<Array<T>>([]);

         useEffect(() => {
         io?.on(options.event, (data: T) => {
         setEvents((events) => {
        return [...events, data];
         });
        options.onEvent?.(data);
         });
            }, [io, options, events, options.event]);

         return {
         options,
         events,
        send: (data) => io?.send(data),
        emit: (event, data) => io?.emit(event, data),
         };
         }`

[darrachequesne]

Hi! The netty-socketio server is only compatible with a 1.x client: mrniko/netty-socketio#834

Could this explain your issue?

[marmon179]

Hi! Thank you the problem was solved by installing socket IO client 2.4 latest version and this import.Then everything worked))))