Compare commits
1 Commits
master
...
dev-220813
| Author | SHA1 | Date | |
|---|---|---|---|
| 5edb8102b5 |
@ -1,19 +0,0 @@
|
|||||||
### 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 />
|
|
||||||
@ -1,2 +0,0 @@
|
|||||||
# ⚠ 这个文件夹用于开发
|
|
||||||
这里边文件包含很多注释和未经测试的功能,不建议使用
|
|
||||||
@ -1,113 +0,0 @@
|
|||||||
/*
|
|
||||||
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!!!!")
|
|
||||||
}
|
|
||||||
132
app.js
132
app.js
@ -1,42 +1,82 @@
|
|||||||
|
/*
|
||||||
|
TODO:
|
||||||
|
* 在指定的房间内广播数据 BroadcastInRoom(roomid, msg)
|
||||||
|
* 探索出能解决将同一roomid的客户加入房间的问题的方法
|
||||||
|
FIXME:
|
||||||
|
* 暂无待修正
|
||||||
|
XXX:
|
||||||
|
* 房间功能
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
// 导入模块
|
||||||
var WebsocketServer = require('websocket').server;
|
var WebsocketServer = require('websocket').server;
|
||||||
var http = require('http');
|
var http = require('http');
|
||||||
var server = http.createServer();
|
const { connection } = require('websocket');
|
||||||
const PORT = 3000 || process.env.PORT
|
//const { client } = require('websocket');
|
||||||
|
|
||||||
clientsList = [];
|
// 创建http服务器(用于承载WS)
|
||||||
|
var server = http.createServer();
|
||||||
|
// 端口设置端口
|
||||||
|
const PORT = 3000 || process.env.PORT
|
||||||
|
// 客户端列表
|
||||||
|
var clientsList = new Map();
|
||||||
|
// 初始化public,这将是未指定房间默认加入的房间
|
||||||
|
clientsList.set('public',[]);
|
||||||
|
|
||||||
|
// http绑定端口
|
||||||
server.listen(PORT, () => {
|
server.listen(PORT, () => {
|
||||||
console.log("Server running on http://localhost:" + PORT);
|
console.log("Server running on http://localhost:" + PORT);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// 在http服务器上运行WS服务器
|
||||||
var wsServer = new WebsocketServer({httpServer:server});
|
var wsServer = new WebsocketServer({httpServer:server});
|
||||||
|
|
||||||
|
// 当客户端连入时
|
||||||
wsServer.on('request', (websocketRequest) => {
|
wsServer.on('request', (websocketRequest) => {
|
||||||
var connection = websocketRequest.accept(null, 'accepted-origin');
|
var connection = websocketRequest.accept(null, 'accepted-origin');
|
||||||
clientsList.push(connection);
|
//将客户端插入终端列表
|
||||||
|
clientsList.get('public').push(connection);
|
||||||
console.log('A client connected');
|
console.log('A client connected');
|
||||||
|
|
||||||
|
// 当收到消息时
|
||||||
connection.on('message', (msg) => {
|
connection.on('message', (msg) => {
|
||||||
|
// 判断消息类型
|
||||||
if(msg.type == 'utf8'){
|
if(msg.type == 'utf8'){
|
||||||
|
// 过滤非法数据
|
||||||
try {
|
try {
|
||||||
|
/*
|
||||||
|
定义的数据传送格式规范(JSON):
|
||||||
|
tag:数据标签
|
||||||
|
msg:数据内容
|
||||||
|
opt:Boolean,确认是否为执行操作,操作tag与用户传输的tag重合。
|
||||||
|
args: opt参数
|
||||||
|
*/
|
||||||
|
// 解析数据
|
||||||
cd = JSON.parse(msg.utf8Data);
|
cd = JSON.parse(msg.utf8Data);
|
||||||
if(cd.tag == 'setRoom' && cd.opt == true){
|
|
||||||
if(connection.roomid == undefined){
|
// 开发中,将客户端加入某个房间
|
||||||
connection.roomid = cd.msg;
|
if(cd.tag == 'setRoom' && cd.opt == true){
|
||||||
}
|
joinToRoom(cd.msg, connection)
|
||||||
console.log("Set! roomid = " + connection.roomid);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 房间内群发
|
||||||
if(cd.tag == 'roomcast' && cd.opt == true && cd.arg != undefined){
|
if(cd.tag == 'roomcast' && cd.opt == true && cd.arg != undefined){
|
||||||
console.log('Cast!')
|
console.log('Cast!')
|
||||||
BroadcastInRoom(cd.arg.roomid, 'cast', cd.msg);
|
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');
|
console.log('Cannot GET arg');
|
||||||
}else{
|
}else{
|
||||||
console.log('Unknown ERROR');
|
console.log('Unknown ERROR');
|
||||||
}
|
}
|
||||||
|
|
||||||
if(cd.opt == false){
|
// 常规消息将对所有
|
||||||
clientsList.forEach(element => {
|
if(cd.opt == null || cd.opt == false){
|
||||||
element.sendUTF(cd.msg);
|
// clientsList.forEach(element => {
|
||||||
});
|
// element.sendUTF(cd.msg);
|
||||||
|
// });
|
||||||
|
broadCastForAll(cd.msg)
|
||||||
}
|
}
|
||||||
console.log(cd);
|
console.log(cd);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
@ -51,14 +91,74 @@ wsServer.on('request', (websocketRequest) => {
|
|||||||
connection.on('close', (reasonCode, description) => {
|
connection.on('close', (reasonCode, description) => {
|
||||||
console.log('A client disconnected');
|
console.log('A client disconnected');
|
||||||
});
|
});
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 房间内消息广播
|
||||||
function BroadcastInRoom(roomid, tag, msg){
|
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 => {
|
clientsList.forEach(element => {
|
||||||
if(element.roomid == roomid){
|
if(element.roomid == roomid){
|
||||||
element.send(JSON.stringify({'tag': tag, 'msg': msg}));
|
element.send(JSON.stringify({'tag': tag, 'msg': msg}));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
console.log("CAST!!!!")
|
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);
|
||||||
|
});
|
||||||
|
});
|
||||||
}
|
}
|
||||||
@ -3,52 +3,11 @@
|
|||||||
<head>
|
<head>
|
||||||
<title>Socket</title>
|
<title>Socket</title>
|
||||||
</head>
|
</head>
|
||||||
<body">
|
<body onload="InitWS()">
|
||||||
<div><input type="text" id="textin"><button onclick="send()">Submit</button> <button onclick="Broadcast()">Submit to room</button></div>
|
<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 />
|
<input type="text" id="roomid"><button onclick="joinTheRoom()">JOIN</button>
|
||||||
<input type="text" id="WS-SERVER" value="ws://localhost:3000"><button onclick="InitWS()">Connect</button>
|
<br />
|
||||||
<script>
|
<div>注意:如果您加入房间后将自动退出public房间,您将不会收到公开消息,但是您可以重新加入到public房间以回复接收</div>
|
||||||
aROOM = 0
|
<script src="main.js"></script>
|
||||||
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>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
45
web/main.js
Normal file
45
web/main.js
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
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");
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user