- これは、自分のIDを制御するURLパラメータによって、単純な例であり、ささやきオブジェクト
- HTTP：2 //localhost/ws.html 1：？ //私のidが1である、私はメッセージのみを与えることができます2
- HTTP :? //localhost/ws.html 1 //私のidが1である、私は一般的にその質量の外に、送信されません。
- HTTP：1 //localhost/ws.html：？ //私はIDを持っていない、私は唯一の質量情報を受信することができ、私はメッセージを与えることができます
- HTTP：//localhost/ws.html //プロフェッショナル集団
- インストールのNode.js
- Wsのモジュールのインストール
npm install ws --saveNode.jsの側のコード
//这是运行在node.js上的
const WebSocket = require('ws');
const wss = new WebSocket.Server({
port:3030,
verifyClient: yan//验证要不要给连接
})
function yan(info){
let url = info.req.url
// let i = url.search(6);
// if (i<0){
// console.log('拒绝连接');
// return false;
// }
console.log('通过连接' + url);
return true;
}
let user={};//存储连接用户
let online=0;//存储在线人数
wss.on('connection',function(ws,req){
online =wss._server._connections;
console.log('当前在线' + online+'个连接');
ws.send('当前在线' + online+'个连接');
let i = req.url;//提取网址参数
let m = i.match(/(?<=\?)[^:]+?(?=:|$)/); //提取我是谁,这部分代码只有第一次连接的时候运行,如果后面连接的m值相同,前面的连接会被覆盖身份
if(m){
user[m] = ws;
};
let u = i.match(/(?<=:).+?$/); //提取发给谁
ws.on('message',function(msg){
console.log('收到'+i+'的消息：'+msg);
// ws.send(req.headers['sec-websocket-key'])
// ws.send(req.url)
if(u){
if (user[u]){
if (user[u].readyState===1){
user[u].send(msg);
ws.send('发送成功');
}else{
ws.send('对方掉线');
}
}else{
ws.send('找不到对象');
}
}else{//广播
wss.clients.forEach(function each(client) {
if (client !== ws && client.readyState === WebSocket.OPEN) {
client.send(msg);
}
});
}
if (online != wss._server._connections){
online = wss._server._connections;
ws.send('当前在线' + online + '个连接');
}
// ws.send(req.headers.origin)
// ws.send(JSON.stringify(Array.from(wss.clients)))
// ws.send(JSON.stringify(ws))
// ws.send(JSON.stringify(req))
})
})ブラウザ側のコード
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div id="a"></div>
<input type="text" id="text"> <input type="button" value="发送" id="btn">
<hr>
<div id="b"></div>
<script>
let i=location.search;
// ?1:2 我是1，我要发给2
// ?1 我是1，要么不发，一发就群发
// ?:2 别管我是谁，我要发给2
i=i.replace(/[^\d\?:]/g,'') //这条是去掉不是数字的，其实有字母也行的
let m=i.match(/(?<=\?)[^:]+?(?=:|$)/) //提取我是谁
let u=i.match(/(?<=:).+?$/) //提取发给谁
m=m?m+'，':'谁？'
u=u? '我给' + u + '发信息':'我群发'
a.innerHTML=('我是'+ m + u)
//-----------------------分割线----------------------------------------------
let ws =new WebSocket('ws://localhost:3030/'+i)
ws.onmessage=(evt)=>{
console.log(evt.data)
b.innerHTML += (evt.data+'<br>')
}
ws.onopen=()=>{
console.log('连接成功')
b.innerHTML += ('连接成功<br>')
// ws.send('你好')
}
ws.οnerrοr=()=>{
console.log('连接错误')
b.innerHTML += ('连接错误<br>')
}
ws.onclose=()=>{
console.log('连接关闭')
b.innerHTML += ('连接关闭<br>')
}
//-----------------------分割线----------------------------------------------
btn.οnclick=()=>ws.send(text.value? text.value:u)
</script>
</body>
</html>
