tcp connection amount of websocket is increasing when a large cookie is existed

GitHub-Yann commented 1 month ago

Hi, there, I have a backend service【websocket service】(https://github.com/mrniko/netty-socketio).

when there is a large cookie in the request , the backend【websocket side】 will print such error:

io.netty.handler.codec.http.websocketx.WebSockeetHandshakeException: not a WebSocket handshakerequest: missing upgrade

although I close the browser , the ESTABLISHED connection is still existed.

if I visit the socket server page directly in the browser, when I close the browser the connection will be gone.

Is there anyone also meet such scenario ? How can we handle it ?

netty： 4.1.96.Final

spring-cloud: 2021.0.8

(1)html page for client:

<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>My Netty Socket client</title>
        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
        <script src="https://cdn.bootcss.com/socket.io/2.1.0/socket.io.js"></script>
        <script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
        <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
        <style>
        body {
        padding:20px;
        }
        #console {
        height: 400px;
        overflow: auto;
        }
        .username-msg {color:orange;}
        .connect-msg {color:green;}
        .disconnect-msg {color:red;}
        .send-msg {color:#888}
        </style>

        <script type="text/javascript">
            var clientid = 'testclient1';
            var targetClientId = 'testclient2';

            var socket;

            function sendDisconnect() {
                socket.disconnect();
            }
            function sendMessage() {
                var message = $('#msg').val();
                $('#msg').val('');
                var jsonObject = {sourceClientId: clientid,
                targetClientId: targetClientId,
                msgType: 'chat',
                msgContent: message};
                socket.emit('messageevent', jsonObject);
            }
            function output(message) {
                var currentTime = "<span class='time'>" + moment().format('HH:mm:ss.SSS') + "</span>";
                var element = $("<div>" + currentTime + " " + message + "</div>");
                $('#console').prepend(element);
            }

            $(function() {
                var hostAddress = $('#hostAddress').val()+'?clientid=' + clientid;
                console.log('------>'+hostAddress);
                console.log('DOM is fully loaded and parsed');
                socket = io.connect(hostAddress);
                socket.on('connect', function() {
                    output('<span class="connect-msg">Client has connected to the server!</span>');
                });
                socket.on('messageevent', function(data) {
                    output('<span class="username-msg">' + data.sourceClientId + ':</span> ' + data.msgContent);
                });
                socket.on('disconnect', function() {
                    output('<span class="disconnect-msg">The client has disconnected!</span>');
                });

            });
        </script>
    </head>

    <body>
        <h1>Netty-socketio Demo Chat</h1>
        <br/>
        <div id="console" class="well">
        </div>
        <form class="well form-inline" onsubmit="return false;">
            <input type="hidden" id="hostAddress" th:value="${hostAddress}" />
            <input id="msg" class="input-xlarge" type="text" placeholder="Type something..."/>
            <button type="button" onClick="sendMessage()" class="btn" id="send">Send</button>
            <button type="button" onClick="sendDisconnect()" class="btn">Disconnect</button>
        </form>
    </body>
</html>
</html>

(2) socket server

@SpringBootApplication
public class App {
        @Bean
    public SocketIOServer socketIOServer() {
        Configuration config = new Configuration();
        config.setHostname(host);
        config.setPort(port);
        config.setPingInterval(milliSecond);
        config.setPingTimeout(milliSecond*2);
        config.setUpgradeTimeout(milliSecond*2);
        config.setExceptionListener(new ExceptionListener(){

            @Override
            public void onEventException(Exception e, List<Object> args, SocketIOClient client) {
                System.out.println("onEventException"+e.getMessage());
            }

            @Override
            public void onDisconnectException(Exception e, SocketIOClient client) {
                System.out.println("onDisconnectException"+e.getMessage());
            }

            @Override
            public void onConnectException(Exception e, SocketIOClient client) {
                System.out.println("onConnectException"+e.getMessage());
            }

            @Override
            public void onPingException(Exception e, SocketIOClient client) {
                System.out.println("onPingException"+e.getMessage());
            }

            @Override
            public void onPongException(Exception e, SocketIOClient client) {
                System.out.println("onPongException"+e.getMessage());
            }

            @Override
            public boolean exceptionCaught(ChannelHandlerContext ctx, Throwable e) throws Exception {
                System.out.println("exceptionCaught");
                return false;
            }

            @Override
            public void onAuthException(Throwable e, SocketIOClient client) {
                System.out.println("onAuthException");
            }

        });
        config.setAuthorizationListener(new AuthorizationListener(){
            @Override
            public AuthorizationResult getAuthorizationResult(HandshakeData data) {
                AuthorizationResult r = new AuthorizationResult(true);
                return r;
            }

        });
        final SocketIOServer server = new SocketIOServer(config);
        return server;
    }

       @Bean
    public SpringAnnotationScanner springAnnotationScanner(SocketIOServer socketServer) {
        return new SpringAnnotationScanner(socketServer);
    }

    public static void main(String[] args) {
        SpringApplication.run(App.class, args);
    }
}
 // -------------------------------------------------------
@Component
public class MessageEventHandler {
    private final SocketIOServer server;

    @Autowired
    public MessageEventHandler(SocketIOServer server) {
        this.server = server;
    }

    @OnConnect
    public void onConnect(SocketIOClient client) {
        String clientId = client.getHandshakeData().getSingleUrlParam("clientid");
                client.sendEvent("message", "onConnect back");
        System.out.println("onConnect----->"+clientId);
    }

    @OnDisconnect
    public void onDisconnect(SocketIOClient client) {
        String clientId = client.getHandshakeData().getSingleUrlParam("clientid");
        System.out.println("onDisconnect----->"+clientId);
    }

    @OnEvent(value = "messageevent")
    public void onEvent(SocketIOClient client, AckRequest request, MessageInfo data) {
        System.out.println("onEvent----->"+data.toString());
    }
}

（3）my gateway route configuration

        {
             // the route for the socket io , the index html page will trigger the websocket request
            "predicate": "Paths: [/socket.io/**], match trailing slash: true",
            "route_id": "a60ff04c-2f9d-4298-9a1e-4909badf343c",
            "filters": [],
            "uri": "http://10.11.9.68:8081",
            "order": 60
        },
        {
             // the route for the index page , such as visit  https://xxxxxxx.xxxx.com/demo-socket/index
            "predicate": "Paths: [/demo-socket/**], match trailing slash: true",    
            "route_id": "d9bd4835-91a6-4192-a5c2-fd7e8234f191",
            "filters": [
                "[[StripPrefix parts = 1], order = 1]"
            ],
            "uri": "http://backend-demo-socket-svc.gateway:80",
            "order": 61
        }

GitHub-Yann commented 1 month ago

you can get my demo by https://github.com/GitHub-Yann/gateway-socket-demo (1) gateway project，it will use 9891 port (2) socket server, it will use 8080 and 8081 port start the two projects. (3) open browser, visit http://localhost:9891/demoy-socket/index, the socket-client page will be shown, then you can input some message into the input field and click the "send" button. (4) simulate big cookies in the browser, like below (5) open several new tabs of the browser, and visit http://localhost:9891/demoy-socket/index in each tab (6) we can see WARN message in socket server (7) after a while, we can close the browser, (8) use netstat -an | findstr 8081 | findstr ESTABLISHED , we can see there is some ESTABLISHED TCP of 8081 port

GitHub-Yann commented 1 month ago

hello , @violetagg , Can you have a look at this?

spring-cloud / spring-cloud-gateway

tcp connection amount of websocket is increasing when a large cookie is existed #3467