优化目录结构，增加开发Note方便对照开发。bugfix。

Co-authored-by: Starlight-0208

DevelopNote.md

@@ -0,0 +1,19 @@
+### 1. 关于数据的传送规范
+通用的数据传输规范
+```json
+{
+    'tag': 'tag',
+    'msg': 'message',
+    'opt': True,
+    'arg':{
+        'arg1': value1,
+        'arg2': value2,
+        ......
+    }
+}
+```
+> 解释：<br />
+> 1. tag里一般存放的是操作标签或者房间名（这个可以自定义）。<br />
+> 2. msg里存放的是消息，也可以是某个命令的主要参数，例如在加入房间的指令中，msg存放的是房间id。<br />
+> 3. opt是一个Boolean类型的值，用来标识这个信息是否为指令，即用于操作WS服务器进行某些操作（例如加入房间，删除房间等等）。<br />
+> 4. arg是一个obj，包括了这个命令的附加参数，在非命令的信息里最好还是不要存在arg，**后续可以考虑加入可以自定义的数据域，可以传输一些附加参数到服务器。**<br />

Development/README.md

@@ -0,0 +1,2 @@
+# ⚠ 这个文件夹用于开发
+这里边文件包含很多注释和未经测试的功能，不建议使用

Development/app.js

@@ -0,0 +1,113 @@
+/*
+TODO:
+* 在指定的房间内广播数据  BroadcastInRoom(roomid, msg)
+* 探索出能解决将同一roomid的客户加入房间的问题的方法
+FIXME:
+* 暂无待修正
+XXX:
+* 房间功能
+*/
+
+
+// 导入模块
+var WebsocketServer = require('websocket').server;
+var http = require('http');
+//const { client } = require('websocket');
+
+// 创建http服务器（用于承载WS）
+var server = http.createServer();
+// 端口设置端口
+const PORT = 3000 || process.env.PORT 
+// 客户端列表
+clientsList = [];
+
+// http绑定端口
+server.listen(PORT, () => {
+    console.log("Server running on http://localhost:" + PORT);
+});
+
+// 在http服务器上运行WS服务器
+var wsServer = new WebsocketServer({httpServer:server});
+
+// 当客户端连入时
+wsServer.on('request', (websocketRequest) => {
+    var connection = websocketRequest.accept(null, 'accepted-origin');
+    //将客户端插入终端列表
+    clientsList.push(connection);
+    console.log('A client connected');
+
+    // 当收到消息时
+    connection.on('message', (msg) => {
+        // 判断消息类型
+        if(msg.type == 'utf8'){
+            // 过滤非法数据
+            try {
+                /*
+                定义的数据传送格式规范（JSON）：
+                tag：数据标签
+                msg：数据内容
+                opt：Boolean，确认是否为执行操作，操作tag与用户传输的tag重合。
+                args: opt参数
+                */
+                // 解析数据
+                cd = JSON.parse(msg.utf8Data);
+                
+                // 开发中，将客户端加入某个房间
+                if(cd.tag == 'setRoom' && cd.opt == true){
+                    // 如果客户端对象没有设置过roomid属性则增设
+                    if(connection.roomid == undefined){
+                        //connection.roomid = [];
+                        connection.roomid = cd.msg;
+                    }
+                    // 将传进来的roomid属性写入
+                    //connection.roomid.push(cd.msg);
+                    console.log("Set! roomid = " + connection.roomid);
+                }
+
+                // 房间内群发
+                if(cd.tag == 'roomcast' && cd.opt == true && cd.arg != undefined){
+                    console.log('Cast!')
+                    BroadcastInRoom(cd.arg.roomid, 'cast', cd.msg);
+                }else if(cd.opt == true && (cd.arg == undefined || cd.arg == "")){
+                    // 无参数提示
+                    console.log('Cannot GET arg');
+                }else{
+                    console.log('Unknown ERROR');
+                }
+
+                // 常规消息
+                if(cd.opt == false){
+                    clientsList.forEach(element => {
+                        element.sendUTF(cd.msg);
+                    });
+                }
+                console.log(cd);
+            } catch (error) {
+                console.log(error);
+                console.error('Illegal Data');
+            }
+        }else{
+            console.log(msg);
+        }
+    });
+
+    connection.on('close', (reasonCode, description) => {
+        console.log('A client disconnected');
+    });
+
+})
+
+// 房间内消息广播
+function BroadcastInRoom(roomid, tag, msg){
+    // for(var i = 0; i < clientsList.length; i++){
+    //     if(clientsList[i].roomid == roomid){
+    //         clientsList[i].send(JSON.stringify({'tag': tag, 'msg': msg}));
+    //     }
+    // }
+    clientsList.forEach(element => {
+        if(element.roomid == roomid){
+            element.send(JSON.stringify({'tag': tag, 'msg': msg}));
+        }
+    });
+    console.log("CAST!!!!")
+}

app.js

@@ -1,82 +1,42 @@
-/*
-TODO:
-* 在指定的房间内广播数据  BroadcastInRoom(roomid, msg)
-* 探索出能解决将同一roomid的客户加入房间的问题的方法
-FIXME:
-* 暂无待修正
-XXX:
-* 房间功能
-*/
-
-
-// 导入模块
 var WebsocketServer = require('websocket').server;
 var http = require('http');
-const { connection } = require('websocket');
-//const { client } = require('websocket');
-
-// 创建http服务器（用于承载WS）
 var server = http.createServer();
-// 端口设置端口
 const PORT = 3000 || process.env.PORT 
-// 客户端列表
-var clientsList = new Map();
-// 初始化public，这将是未指定房间默认加入的房间
-clientsList.set('public',[]);
 
-// http绑定端口
+clientsList = [];
 server.listen(PORT, () => {
     console.log("Server running on http://localhost:" + PORT);
 });
 
-// 在http服务器上运行WS服务器
 var wsServer = new WebsocketServer({httpServer:server});
 
-// 当客户端连入时
 wsServer.on('request', (websocketRequest) => {
     var connection = websocketRequest.accept(null, 'accepted-origin');
-    //将客户端插入终端列表
-    clientsList.get('public').push(connection);
+    clientsList.push(connection);
     console.log('A client connected');
-
-    // 当收到消息时
     connection.on('message', (msg) => {
-        // 判断消息类型
         if(msg.type == 'utf8'){
-            // 过滤非法数据
             try {
-                /*
-                定义的数据传送格式规范（JSON）：
-                tag：数据标签
-                msg：数据内容
-                opt：Boolean，确认是否为执行操作，操作tag与用户传输的tag重合。
-                args: opt参数
-                */
-                // 解析数据
                 cd = JSON.parse(msg.utf8Data);
-                
-                // 开发中，将客户端加入某个房间
-                if(cd.tag == 'setRoom' && cd.opt == true){
-                    joinToRoom(cd.msg, connection)
+                if(cd.tag == 'setRoom' && cd.opt == true){ 
+                    if(connection.roomid == undefined){
+                        connection.roomid = cd.msg;
+                    }
+                    console.log("Set! roomid = " + connection.roomid);
                 }
-
-                // 房间内群发
                 if(cd.tag == 'roomcast' && cd.opt == true && cd.arg != undefined){
                     console.log('Cast!')
                     BroadcastInRoom(cd.arg.roomid, 'cast', cd.msg);
-                }else if(cd.opt == true && (cd.arg == undefined || cd.arg == "")){
-                    // 无参数提示
+                }else if(cd.opt == true && (cd.arg == undefined || cd.arg == "")){ 
                     console.log('Cannot GET arg');
                 }else{
                     console.log('Unknown ERROR');
                 }
-
-                // 常规消息将对所有
-                if(cd.opt == null || cd.opt == false){
-                    // clientsList.forEach(element => {
-                    //     element.sendUTF(cd.msg);
-                    // });
-                    broadCastForAll(cd.msg)
+                
+                if(cd.opt == false){
+                    clientsList.forEach(element => {
+                        element.sendUTF(cd.msg);
+                    });
                 }
                 console.log(cd);
             } catch (error) {
@@ -91,74 +51,14 @@ wsServer.on('request', (websocketRequest) => {
     connection.on('close', (reasonCode, description) => {
         console.log('A client disconnected');
     });
-
 })
 
-// 房间内消息广播
+
 function BroadcastInRoom(roomid, tag, msg){
-    // for(var i = 0; i < clientsList.length; i++){
-    //     if(clientsList[i].roomid == roomid){
-    //         clientsList[i].send(JSON.stringify({'tag': tag, 'msg': msg}));
-    //     }
-    // }
     clientsList.forEach(element => {
         if(element.roomid == roomid){
             element.send(JSON.stringify({'tag': tag, 'msg': msg}));
         }
     });
     console.log("CAST!!!!")
-}
-
-function joinToRoom(roomid, connection){
-    // 如果客户端对象没有设置过roomid属性则增设
-    if(connection.roomid == undefined){
-        connection.roomid = [];
-        //connection.roomid = cd.msg;
-        connection.roomid.push(roomid)
-    }
-    // 如果未创建过该房间，则创建
-    if(!clientsList.has(roomid)){
-        clientsList.set(roomid,[]);
-        console.log('Create Room: ' + roomid);
-    }
-    // 将client加入到指定roomid的list
-    clientsList.get(roomid).push(connection);
-    // 将传进来的roomid属性写入
-    connection.roomid.push(cd.msg);
-    console.log("Set! roomid = " + connection.roomid);
-}
-
-// 离开房间
-function leaveFromRoom(roomid, connection){
-    // 如果客户端对象没有设置过roomid属性则返回错误信息
-    if(connection.roomid == undefined){
-        return false;
-    }
-    // 将client从ClientsList指定的房间roomid中移除并移入默认的public --可能会有问题 --Written By Copilot
-    clientsList.get(roomid).splice(clientsList.get(roomid).indexOf(connection), 1);
-    // 若房间内没有人了，则将房间移除 --可能会有问题 --Written By Copilot
-    if(clientsList.get(roomid).length == 0){
-        clientsList.delete(roomid);
-        console.log('Delete Room: ' + roomid);
-    }
-    clientsList.get('public').push(connection);
-
-    // 将client从指定的roomid中移除 -- 可能会有问题 -- Written By Copilot
-    connection.roomid.splice(connection.roomid.indexOf(roomid), 1);
-    console.log("Leave! roomid = " + connection.roomid);
-}
-
-
-// 获取已加入的房间
-function getJoinedRoom(connection){
-    return connection.roomid
-}
-
-// 广播消息
-function broadCastForAll(msg){
-    clientsList.forEach(Listed => {
-        Listed.forEach(Client => {
-            Client.sendUTF(msg);
-        });
-    });
 }

web/index.html

@@ -3,11 +3,52 @@
 <head>
     <title>Socket</title>
 </head>
-<body onload="InitWS()">
+<body">
     <div><input type="text" id="textin"><button onclick="send()">Submit</button> <button onclick="Broadcast()">Submit to room</button></div>
-    <input type="text" id="roomid"><button onclick="joinTheRoom()">JOIN</button>
-    <br />
-    <div>注意：如果您加入房间后将自动退出public房间，您将不会收到公开消息，但是您可以重新加入到public房间以回复接收</div>
-    <script src="main.js"></script>
+    <input type="text" id="roomid"><button onclick="joinTheRoom()">JOIN</button><br />
+    <input type="text" id="WS-SERVER" value="ws://localhost:3000"><button onclick="InitWS()">Connect</button>
+    <script>
+        aROOM = 0
+        function joinTheRoom(){
+            aROOM = document.getElementById('roomid').value;
+            var Datas = {'tag': 'setRoom', 'msg': aROOM, 'opt': true};
+            ws.send(JSON.stringify(Datas));
+            console.log("Join to room " + aROOM);
+            // 结果返回
+        }
+
+        function send(){
+            var context = document.getElementById('textin').value;
+            var data = {'tag': 'public', 'msg': context, 'opt': false};
+            ws.send(JSON.stringify(data));
+        }
+
+        function Broadcast(){
+            var context = document.getElementById('textin').value;
+            var data = {'tag': 'roomcast', 'msg': context, 'opt': true, 'arg': {'roomid': aROOM}};
+            ws.send(JSON.stringify(data));
+        }
+        
+        function InitWS(){
+            if("WebSocket" in window){
+                console.log("您的浏览器支持Websocket");
+                ws = new WebSocket(document.getElementById('WS-SERVER').value);
+                ws.onopen = function(){
+                    console.log("connected!");
+                }
+
+                ws.onmessage = function(evt){
+                    var rece = evt.data;
+                    console.log("received: "+ rece);
+                }
+
+                ws.onclose = function(){
+                    console.log("disconnected!");
+                }
+            }else{
+                alert("您的浏览器不支持Websocket");
+            }
+        }
+    </script>
 </body>
 </html>

web/main.js

@@ -1,45 +0,0 @@
-window.onload = function(){
-    InitWS();
-}
-
-aROOM = 0
-function joinTheRoom(){
-    aROOM = document.getElementById('roomid').value;
-    var Datas = {'tag': 'setRoom', 'msg': aROOM, 'opt': true};
-    ws.send(JSON.stringify(Datas));
-    console.log("Join to room " + aROOM);
-    // 结果返回
-}
-
-function send(){
-    var context = document.getElementById('textin').value;
-    var data = {'tag': 'public', 'msg': context, 'opt': false};
-    ws.send(JSON.stringify(data));
-}
-
-function Broadcast(){
-    var context = document.getElementById('textin').value;
-    var data = {'tag': 'roomcast', 'msg': context, 'opt': true, 'arg': {'roomid': aROOM}};
-    ws.send(JSON.stringify(data));
-}
-        
-function InitWS(){
-    if("WebSocket" in window){
-        console.log("您的浏览器支持Websocket");
-        ws = new WebSocket("ws://localhost:3000");
-        ws.onopen = function(){
-            console.log("connected!");
-        }
-
-        ws.onmessage = function(evt){
-            var rece = evt.data;
-            console.log("received: "+ rece);
-        }
-
-        ws.onclose = function(){
-            console.log("disconnected!");
-        }
-    }else{
-        alert("您的浏览器不支持Websocket");
-    }
-}