fix - sub-protocol handling

Author: manuel-lohmus

README.html

@@ -203,7 +203,7 @@ <h2 id="usage">Usage</h2>
 &lt;/body&gt;
 &lt;/html&gt;
 </code></pre>
-<p>Complete example of use on the server and client side can be found in the <a href="https://github.com/manuel-lohmus/ws13/tree/master/examples/Server">examples/Server</a> directory.</p>
+<p>Complete example of use on the server and client side can be found in the <a href="https://github.com/manuel-lohmus/ws13/tree/master/examples/chat">examples/chat</a> directory.</p>
 <p><strong>Secure communication</strong></p>
 <p>To use secure communication, you need to use the <code>https</code> module and the <code>wss</code> protocol.</p>
 <p><strong>Example of use on a <code>https</code> server</strong></p>

README.md

@@ -219,7 +219,7 @@ const ws = createWebSocket({
 </html>
 ```
 
-Complete example of use on the server and client side can be found in the [examples/Server](https://github.com/manuel-lohmus/ws13/tree/master/examples/Server) directory.
+Complete example of use on the server and client side can be found in the [examples/chat](https://github.com/manuel-lohmus/ws13/tree/master/examples/chat) directory.
 
 **Secure communication**
 

examples/Server/.vscode/launch.json examples/chat/.vscode/launch.jsonexamples/Server/.vscode/launch.json renamed to examples/chat/.vscode/launch.json

@@ -6,12 +6,13 @@ import fs from 'node:fs';
 import { pipeline } from 'node:stream';
 
 var server = new http.createServer(),
-    wsList = [];
+    chatList = [],
+    superchatList = [];
 
 // upgrade event for WebSocket
 server.on('upgrade', function upgrade(request) {
 
-    // creates WebSocket
+    // create WebSocket for sub-protocol: 'chat'
     var websocket = createWebSocket({
 
         // upgrade request
@@ -21,7 +22,7 @@ server.on('upgrade', function upgrade(request) {
         isDebug: true,
 
         // the sub-protocol the server is ready to communicate with the client (optional)
-        /*protocol = '',*/
+        protocol: 'chat',
 
         // the origin of the request (optional)
         origin: 'http://localhost:3000',
@@ -37,7 +38,7 @@ server.on('upgrade', function upgrade(request) {
     if (websocket) {
 
         // inserts a WebSocket from the list
-        wsList.push(websocket);
+        chatList.push(websocket);
 
         // add listeners to the WebSocket
         websocket
@@ -52,21 +53,63 @@ server.on('upgrade', function upgrade(request) {
             .on('message', (event) => {
 
                 // send to everyone
-                wsList.forEach(function (socket) {
+                chatList.forEach(function (socket) {
 
                     // send message to the client
-                    socket.send(`ws-${wsList.indexOf(websocket)}: ${event.data}`);
+                    socket.send(`chat-${chatList.indexOf(websocket)}: ${event.data}`);
                 });
             })
             // connection closed with the client
             .on('close', function (event) {
 
                 // removing an WebSocket from list 
-                wsList = wsList.filter(ws => ws !== websocket);
+                chatList = chatList.filter(ws => ws !== websocket);
             });
+
+        return;
     }
-        // handshake not accepted, close the connection with the client
-    else { request.socket.end(); }
+
+    
+    // create WebSocket for sub-protocol: 'superchat'
+    websocket = createWebSocket({ request, protocol: 'superchat' });
+
+    // has WebSocket, the handshake is done
+    if (websocket) {
+
+        // inserts a WebSocket from the list
+        superchatList.push(websocket);
+
+        // add listeners to the WebSocket
+        websocket
+            // error handling
+            .on('error', console.error)
+            // connection established with the client (handshake done)
+            .on('open', () => {
+
+                /* now you can send and receive messages */
+            })
+            // message received from the client (event.isBinary is boolean) (event.data is string or buffer)
+            .on('message', (event) => {
+
+                // send to everyone
+                superchatList.forEach(function (socket) {
+
+                    // send message to the client
+                    socket.send(`superchat-${superchatList.indexOf(websocket)}: ${event.data}`);
+                });
+            })
+            // connection closed with the client
+            .on('close', function (event) {
+
+                // removing an WebSocket from list 
+                superchatList = superchatList.filter(ws => ws !== websocket);
+            });
+
+        return;
+    }
+
+    // handshake not accepted, close the connection with the client
+    request.socket.end();
 
 });
 

examples/Server/app.js examples/chat/app.jsexamples/Server/app.js renamed to examples/chat/app.js

@@ -29,10 +29,11 @@
 
             if (!wsHost) { return; }
 
-            const host = location.protocol.replace('http', 'ws') + '//' + wsHost;
+            const host = location.protocol.replace('http', 'ws') + '//' + wsHost,
+                protocol = $('#subProtocol')?.value ? $('#subProtocol')?.value.split(' ') : [];
 
             try {
-                socket = new WebSocket(host);
+                socket = new WebSocket(host, protocol);
                 state();
 
                 socket.onmessage = function (event) {
@@ -58,7 +59,10 @@
 
             setTimeout(function () {
 
-                $('#status').innerHTML = 'WebSocket - ' + (socket === null ? 'CLOSED' : constants[socket.readyState]);
+                $('#status').innerHTML = '<b>Status:</b> <code>' + (socket === null ? 'CLOSED' : constants[socket.readyState]) + '</code>';
+                $('#selectProtocol').innerHTML = socket === null || !socket.protocol
+                    ? ''
+                    : ' <b>Sub-Protocol:</b> <code>' + socket.protocol + '</code> <b>Extensions:</b> <code>' + socket.extensions + '</code>';
 
                 if (socket && constants[socket.readyState] === "OPEN") {
 
@@ -134,10 +138,16 @@
 <body onload="init()">
     <h3>WebSocket Test</h3>
     <table>
-        <tr><td><span id="status"></span></td></tr>
+        <tr><td><span id="status"></span> <span id="selectProtocol"></span></td></tr>
         <tr><td><div id="log"></div></td></tr>
         <tr>
             <td>
+                <select id="subProtocol">
+                    <option value="chat" selected>chat</option>
+                    <option value="superchat">superchat</option>
+                    <option value="">none</option>
+                    <option value="superchat chat">any</option>
+                </select>
                 <input id="msg" list="commands" type="text" onkeypress="onkey(event)" />
                 <datalist id="commands"></datalist>
                 <button id="btnSend" onclick="send()">Send</button>

examples/Server/index.html examples/chat/index.htmlexamples/Server/index.html renamed to examples/chat/index.html

@@ -200,10 +200,15 @@ function createWebSocket({
 
         request.on('upgrade', function (response) {
 
-            var err = validateHandshake(response.headers);
+            var err = validateHandshake(response?.headers);
 
             if (err) { return destroy(err); }
 
+            if (response?.headers?.["sec-websocket-protocol"]) {
+
+                protocol = response.headers["sec-websocket-protocol"];
+            }
+
             if (response?.headers?.["sec-websocket-extensions"]) {
 
                 if (typeof extension?.activate === 'function') {
@@ -298,8 +303,8 @@ function createWebSocket({
         if (!socket
             || headers?.["sec-websocket-version"] !== '13'
             || !headers?.["sec-websocket-key"]) { return false; }
-        // TODO > protocol accept > Done
-        if (protocol && headers && headers?.["sec-websocket-protocol"] !== protocol) {
+        if (protocol && headers && headers["sec-websocket-protocol"]
+            && headers["sec-websocket-protocol"] !== protocol) {
 
             var offerProtocols = headers?.["sec-websocket-protocol"].split(',')
                 .map(entry => (entry + '').trim().toLowerCase()),

examples/Server/package-lock.json examples/chat/package-lock.jsonexamples/Server/package-lock.json renamed to examples/chat/package-lock.json

@@ -222,8 +222,8 @@ testRunner("WS - Tests            ", { skip: false }, (test) => {
 /**
  * Test runner. Function to run unit tests in the console.
  * @author Manuel Lõhmus 2024 (MIT License)
- * @version 1.1.0
- * [2024-12-29] adde    d functionality to select tests by ID in the command line arguments (e.g. --testID=1 2 3)
+ * @version 1.1.1
+ * [2024-12-29] adde    d functionality to select tests by ID in the command line arguments (e.g. --testIDs=1 2 3)
  * @example `npm test '--'` or `node index.test.js`
  * @example `npm test '--' --help` or `node index.test.js --help`
  * @example `npm test '--' --testIDs=1 2 3` or `node index.test.js --testIDs=1 2 3`
@@ -285,7 +285,7 @@ node index.test.js [OPTION1=VALUE1] [OPTION2=VALUE2] ...
 
 The following options are supported:
     --help      Display this help
-    --testID    Number of the test to run
+    --testIDs   Number of the test to run (e.g. node index.test.js --testIDs=1 2 3)
     `);
 
         if (process.argv[1].endsWith(".js")) { exitPressKey(); }