/
example.js
115 lines (103 loc) · 2.48 KB
/
example.js
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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
// EXAMPLE OF A CHAT
const { WsServer, WsClient } = require("./index");
const port = 8000;
// CLIENT SETUP
const endpoint = `'ws://' +
window.location.hostname +
(window.location.port ? ':' + window.location.port : '${port}')`;
// client side handler of server commands
function messageHandler(cmd, payload) {
var messages = document.getElementById("messages");
switch (cmd) {
case "message":
messages.innerText += payload + "\n";
break;
}
}
function send() {
var prompt = document.getElementById("prompt");
var msgToSend = prompt.value || "";
if (msgToSend) {
prompt.value = "";
wsClient.sendCommand("messageAll", msgToSend);
}
}
// server side rendered/cached view w/ WebSocketClient
const view = `
<html>
<head>
<style rel="text/stylesheet">
#messages {
width: 300px;
height: 200px;
border: 1px solid #000;
padding: 2px;
overflow: auto;
text-wrap: true;
}
#prompt {
width: 250px;
margin-top: 5px;
}
</style>
</head>
<body>
<div id="messages"></div>
<input type="text" id="prompt" value="" />
<button onclick="send();">SEND</button>
</body>
<script type="text/javascript">
${WsClient.toString()}
var wsClient = new WebSocketClient();
var send = ${send.toString()};
var messageHandler = ${messageHandler.toString()};
wsClient.connect({
URL: ${endpoint},
autoReconnect: true,
reconnectionDelay: 5000,
onOpen: function() { console.log("Connection open!"); },
onMessage: messageHandler,
onError: console.error,
onClose: console.log,
});
</script>
</html>
`;
// SERVER SETUP
const ws = WsServer({
port,
log: (...args) => console.log(...args),
error: (...args) => console.error(...args),
requestListener: (req, resp) => {
// http router
switch (req.url) {
case "/":
resp.writeHead(200, {
"Content-Type": "text/html"
});
resp.end(view, "utf-8");
break;
default:
resp.writeHead(404, {
"Content-Type": "text/plain"
});
resp.end("404 - Page not found!", "utf-8");
break;
}
}
});
// handle commands from the client
ws.onSocketMessage = (msg, socket) => {
console.log("client sends:", msg);
try {
const { command, payload } = JSON.parse(msg);
switch (command) {
// custom command broadcast
case "messageAll":
ws.broadcast("message", payload);
break;
}
} catch (err) {
console.error(err.message);
}
};