Client’s two socket connection with different path overlaps the second connection

I’m having two client connections in flutter based on the condition of the list,
and Server has two server sockets with different ports and different Handshake paths for clients to easily connect.

Server :

Name     | Port | Handshake path 
Socket A | 3001 | /one
Socket B | 3002 | /two

so while connecting from the flutter application whichever the listItem I open first, connection with specified handshake path is established.

Items | HandshakePath
Item1 | /one
Item2 | /two
Item3 | /one

For the above scenario when I Click on Item 1 it makes a connection with /one socket on the server and everything work fine, but after that when I click on Item2 it still creates a connection on /one path, and this same for Vice versa, whichever connection is made first, stays connected and overlaps the second connection.

Connection Class 1

Class One{
 IO.Socket _socket;
 connect(){
 _socket = IO.io(
        deployment ? _serverIP : SERVER_ONE,
        IO.OptionBuilder()
            .setTransports([
              'websocket'
            ]) 
            .setQuery({
              "info": _fromUser,
            })
            .setPath(deployment ? "/one" : "/socket.io")
            .disableAutoConnect()
            .build());
 }
}

Connection Class 2

Class Two{
 IO.Socket _socket;
 connect(){
 _socket = IO.io(
        deployment ? _serverIP : SERVER_TWO,
        IO.OptionBuilder()
            .setTransports([
              'websocket'
            ]) 
            .setQuery({
              "user1": _fromUser1,
              "user2": _fromUser2,
            })
            .setPath(deployment ? "/two" : "/socket.io")
            .disableAutoConnect()
            .build());
 }
}

connection with the local server is working perfectly fine, I guess it’s because of the different ports mentioned in ENV variables, but on the server, I’ve set up routing forwarding to different ports based on the path.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

After help from the community on discord, I found the working solution.

when we are creating a first socket client connection in flutter using socket_io_client whatever Option Builder values we are providing, will be used in every instance that we will create even though we are providing different values it will use the previous value only. in that case,

we have to use the enableForceNew() method to provide a different value

  _socket = IO.io(
            deployment ? _serverIP : SERVER_TWO,
            IO.OptionBuilder()
                .enableForceNew() // <--- this method
                .setTransports([
                  'websocket'
                ]) 
                .setQuery({
                  "user1": _fromUser1,
                  "user2": _fromUser2,
                })
                .setPath(deployment ? "/two" : "/socket.io")
                .disableAutoConnect()
                .build());

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0