【javascript】基于websocket、nodejs、uniapp的聊天室

本文基于websocket,nodejs,uniapp技术栈开发了一个简易聊天室，可以进行简单的群聊和单聊的功能。

• 登陆后在聊天大厅可以进行群聊
• 查看当前在线用户
• 选择指定在线用户进行单聊

项目地址：https://github.com/Undertone0809/ZeeChatroom

效果图

• 首页

• 选择头像

• 群聊大厅

• 单聊

拓扑图

服务端架构

客户端架构

流程图

数据流转方式

主要代码

module.exports = function(io){
	var socketList = {};
	var users = [];

	io.sockets.on('connection',function(socket){
		console.log('[info] one user connected');

    // 加入群聊
		socket.on('join',(name,img) => {
			// init
			socket.name = name;
			socketList[name] = socket.id;
			let user = {name:name,img:img,id:socket.id,tip:false};
			users.push(user);

			socket.broadcast.emit('welcome',name,users);
			socket.emit('myself',name,users,socket.id);
		});

		//接收信息广播
		socket.on('message',data => {
			//广播
			socket.broadcast.emit('sendMsg',data);
		})

		//一对一消息
		socket.on('msg',data => {
			//console.log(data.tid);
			//发送给指定用户
			socket.to(data.tid).emit('sMsg',data);
		})

		socket.on('quit',name => {
      //删除
      delete socketList[name];
      for(var i=0;i<users.length;i++){
        if(users[i].name == name) users.splice(i,1);
      }
      //广播
			socket.broadcast.emit('quit',name,users);
		})
    
		//用户离开
		socket.on('disconnecting',function(){
			if(socketList.hasOwnProperty(socket.name)){
				//删除
				delete socketList[socket.name];
				for(var i=0;i<users.length;i++){
					if(users[i].name == socket.name){
						users.splice(i,1);
					}
				}
				//广播有用户退出
				socket.broadcast.emit('quit',socket.name,users);
			}
		})
	})
}