diff --git a/DevelopNote.md b/DevelopNote.md index e3081d4..fff5d3b 100644 --- a/DevelopNote.md +++ b/DevelopNote.md @@ -16,4 +16,33 @@ > 1. tag里一般存放的是操作标签或者房间名(这个可以自定义)。
> 2. msg里存放的是消息,也可以是某个命令的主要参数,例如在加入房间的指令中,msg存放的是房间id。
> 3. opt是一个Boolean类型的值,用来标识这个信息是否为指令,即用于操作WS服务器进行某些操作(例如加入房间,删除房间等等)。
-> 4. arg是一个obj,包括了这个命令的附加参数,在非命令的信息里最好还是不要存在arg,**后续可以考虑加入可以自定义的数据域,可以传输一些附加参数到服务器。**
\ No newline at end of file +> 4. arg是一个obj,包括了这个命令的附加参数,在非命令的信息里最好还是不要存在arg,**后续可以考虑加入可以自定义的数据域,可以传输一些附加参数到服务器。**
+ +### Step1. 加入Room之间的数据交换 +在客户端申请加入一个room时候,会向服务器发送一个这样子的请求: +```JSON +{ + "tag": "setRoom", + "msg": Roomid, + "opt": true, + "arg": {} +} +``` +> 其中的arg字段可以不写,因为实际上服务器并不会调用这个arg。当然,为了遵守规范,在底层实际编写的时候还是会保留一个空对象结构arg。 + +服务端在接收到这个请求之后就先回去判断用户是否已经加入某个房间,由于设计上并不考虑一客户端加入到多个房间的情况,所以成功加入的话就会自动从原来房间退出。如果原来从未加入过房间,则对应客户端的对象内不会包含roomid元素即它的值是`undefined`。如果检测到未加入过房间,则直接将client请求的roomid直接赋值进去。如果原来已经加入过room,即room不为`undefined`则新值会替换原来的值,并在后端给予一定的提示(未来也许会加入多房间功能或者进退房间提示等等...,现在属于是预留了最基本的条件了)。 + +如果服务器已经完成了工作,就会给予客户端一个回应,回应体结构如下: +```JSON +{ + "msg": "Join room success!", + "opt": false, + "tag": "reply", + "arg":{ + "topic": "JoinRoom", + "reasonCode": 200 + } +} +``` +这个结构是固定的,所以client直接用识别内容即可。 +> reasonCode目前还未定义其含义。 \ No newline at end of file diff --git a/app.js b/app.js index ca6e34e..b60dcfb 100644 --- a/app.js +++ b/app.js @@ -18,11 +18,20 @@ wsServer.on('request', (websocketRequest) => { if(msg.type == 'utf8'){ try { cd = JSON.parse(msg.utf8Data); + /* Not support multiply room */ if(cd.tag == 'setRoom' && cd.opt == true){ if(connection.roomid == undefined){ connection.roomid = cd.msg; } console.log("Set! roomid = " + connection.roomid); + connection.sendUTF(JSON.stringify({ + 'tag': 'reply', + 'msg': 'Join room success!', + 'opt': false, + 'arg':{ + 'topic': 'JoinRoom' + } + })); } if(cd.tag == 'roomcast' && cd.opt == true && cd.arg != undefined){ console.log('Cast!') diff --git a/web/DIST/index.html b/web/DIST/index.html new file mode 100644 index 0000000..a31841b --- /dev/null +++ b/web/DIST/index.html @@ -0,0 +1,13 @@ + + + + Socket + + +
+
+ + + + + \ No newline at end of file diff --git a/web/DIST/js/main.js b/web/DIST/js/main.js new file mode 100644 index 0000000..3bc99b6 --- /dev/null +++ b/web/DIST/js/main.js @@ -0,0 +1,5 @@ +aROOM = 0 +document.getElementById('WS-SERVER').value +var context = document.getElementById('textin').value; +aROOM = document.getElementById('roomid').value; +var context = document.getElementById('textin').value; \ No newline at end of file diff --git a/web/DIST/js/websocket.js b/web/DIST/js/websocket.js new file mode 100644 index 0000000..6e46efc --- /dev/null +++ b/web/DIST/js/websocket.js @@ -0,0 +1,45 @@ +class Websocket2Clinet{ + // Constructor + constructor(server_addr){ + if("WebSocket" in window){ + console.log("您的浏览器支持Websocket"); + ws = new WebSocket(server_addr); + 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"); + } + } + + Broadcast(content, roomid){ + // var data = {'tag': 'roomcast', 'msg': context, 'opt': true, 'arg': {'roomid': aROOM}}; + // ws.send(JSON.stringify(data)); + ws.send(JSON.stringify({'tag': 'roomcast', 'msg': content, 'opt': true, 'arg': {'roomid': roomid}})); + } + + joinTheRoom(roomid){ + // var Datas = {'tag': 'setRoom', 'msg': aROOM, 'opt': true}; + // ws.send(JSON.stringify(Datas)); + // console.log("Join to room " + aROOM); + // 结果返回 + + ws.send(JSON.stringify({'tag': 'setRoom', 'msg': roomid, 'opt': true})); + console.log("Join to room: " + roomid); + } + + send(content){ + // var data = {'tag': 'public', 'msg': context, 'opt': false}; + // ws.send(JSON.stringify(data)); + ws.send(JSON.stringify({'tag': 'public', 'msg': content, 'opt': false})); + } +} \ No newline at end of file