简单的多人聊天室
Posted lzzxm
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了简单的多人聊天室相关的知识，希望对你有一定的参考价值。
1.安装nodejs-websocket 和 socket.io
npm install nodejs-websocket socket.io
2.html 中引入socket.io.js文件
在html中 通过 socket = io(‘ws://localhost:3000/‘);开启socket连接,通过socket.emit（‘对应于服务器的自定义事件名’,‘内容’）发送信息，socket.on（‘对应于服务器的事件名’，‘内容’）接受信息
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="socket.io.js"></script>
<script type="text/javascript" src="jquery-2.1.4.min.js"></script>
</head>
<body>
<input type="text" name="" id="cont" value="" />
<button type="button" id="send">发送</button>
<script type="text/javascript">
const socket = io(‘ws://localhost:3000/‘);
function showMessage(str,type){
var div = document.createElement(‘div‘);
div.innerHTML = str;
if(type==‘enter‘){
div.style.color = ‘royalblue‘
}else if(type==‘leave‘){
div.style.color = ‘red‘
}
document.body.appendChild(div)
}
$(‘#send‘).on(‘click‘,function(){
var txt = $(‘#cont‘).val();
if(txt){
socket.emit(‘message‘,txt)
}
})
socket.on(‘enter‘, (data) => {
showMessage(data,‘enter‘)
// socket.emit(‘my other event‘, { my: ‘data‘ });
});
socket.on(‘message‘, (e) => {
showMessage(e,‘message‘)
});
socket.on(‘leave‘, (e) => {
showMessage(e,‘leave‘)
});
</script>
</body>
</html>
服务器端（server.js）
const app = require(‘http‘).createServer() const io = require(‘socket.io‘)(app); var clinet = 0; var port = 3000 app.listen(port); io.on(‘connection‘, (socket) => { clinet++; socket.nickname = "user"+clinet io.emit(‘enter‘, socket.nickname + "进入聊天室"); socket.on(‘message‘, (data) => { io.emit(‘message‘, socket.nickname + ":"+data); }); socket.on(‘disconnect‘, (data) => { io.emit(‘leave‘, socket.nickname + "离开聊天室"); }); }); console.log(‘server is running on ‘+port)
然后通过node server.js启动服务
以上是关于简单的多人聊天室的主要内容，如果未能解决你的问题，请参考以下文章
游戏开发实战Unity使用Socket通信实现简单的多人聊天室（万字详解 | 网络 | TCP | 通信 | Mirror | Networking）
游戏开发实战Unity使用Socket通信实现简单的多人聊天室（万字详解 | 网络 | TCP | 通信 | Mirror | Networking）