SmartPDU-Unuse/Xianglinghui/03.lib/appweb-doc/samples/websockets-chat/web/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset=utf-8>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
</head>

<body>
    <h4>Outgoing Message</h4>
    <form id="chat">
        Message: <input id="msg" name="msg" type="text">
        <input type="submit" value="Send">
    </form>

    <h4>Incoming Messages</h4>
    <div id="messages" />

    <script>
    $(document).ready(function() {
        var ws = new WebSocket('ws://localhost:8080/ws/test/chat', ['chat']);

        ws.onopen = function (e) {
            console.log("OPEN");
            console.log(e.data);
        };
        ws.onmessage = function (e) {
            console.log("MSG", e.data);
            $("#messages").append("<p>" + e.data + "</p>");
        };
        ws.onclose = function (e) {
            console.log("CLOSED");
        };
        ws.onerror = function (e) {
            console.log("Error " + e);
        };

        $("#chat").submit(function(e) {
            var text = $('#msg').val();
            ws.send(text);
            e.preventDefault();
            return false;
        });
    });
    </script>

</body>
</html>