Websocket/ws-test.html at master · t4web/Websocket · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<html lang="en">
<body>
<input type="text" id="input" placeholder="Message…" />
<hr />
<pre id="output"></pre>

<script>
    var host   = 'ws://127.0.0.1:8088';
    var socket = null;
    var input  = document.getElementById('input');
    var output = document.getElementById('output');
    var print  = function (message) {
        var samp       = document.createElement('samp');
        samp.innerHTML = message + '\n';
        output.appendChild(samp);
        return;
    };

    input.addEventListener('keyup', function (evt) {
        if (13 !== evt.keyCode) {
            return;
        }

        var msg = {
            'event' : 'ping',
            'data': {message: input.value}
        };

        if (!msg) {
            return;
        }

        try {
            print('Send: ' + JSON.stringify(msg, null, 4));
            socket.send(JSON.stringify(msg));
            input.value = '';
            input.focus();
        } catch (e) {
            console.log(e);
        }

        return;
    });

    try {
        socket = new WebSocket(host);
        socket.onopen = function () {
            print('connection is opened');
            input.focus();
            return;
        };
        socket.onmessage = function (msg) {
            print('Receive: ' + JSON.stringify(JSON.parse(msg.data), null, 4));
            return;
        };
        socket.onclose = function () {
            print('connection is closed');
            return;
        };
    } catch (e) {
        console.log(e);
    }
</script>
</body>
</html>