广告
返回顶部
首页 > 资讯 > 前端开发 > node.js >Nodejs实现多房间简易聊天室功能
  • 130
分享到

Nodejs实现多房间简易聊天室功能

简易聊天室房间 2022-06-04 17:06:35 130人浏览 薄情痞子
摘要

1、前端界面代码   前端不是重点,够用就行,下面是前端界面,具体代码可到GitHub下载。 2、服务器端搭建   本服务器需要提供两个功能:Http服务和websocket服务,由于node的事件驱动机制

1、前端界面代码

  前端不是重点,够用就行,下面是前端界面,具体代码可到GitHub下载。

2、服务器端搭建

  本服务器需要提供两个功能:Http服务和websocket服务,由于node的事件驱动机制,可将两种服务搭建在同一个端口下。

  1、包描述文件:package.JSON,这里用到了两个依赖项,mime:确定静态文件mime类型,Socket.io:搭建WEBsocket服务,然后使用npm install 安装依赖


{
 "name": "chat_room",
 "version": "1.0.0",
 "description": "this is a room where you can chat with your friends",
 "main": "index.js",
 "scripts": {
  "test": "echo "Error: no test specified" && exit 1"
 },
 "author": "sfs",
 "license": "ISC",
 "dependencies": {
  "socket.io":"2.0.3",
  "mime":"1.3.6"
 }
}

  2、http服务器

  http服务主要是给web浏览器提供静态文件,既浏览器发来一个请求,服务器返回一个响应。


const 
  http=require('http'),
  fs=require('fs'),
  path=require('path'),
  mime=require('mime'),
  chatServer=require('./lib/chat_server');

var cache={};//缓存静态文件内容
//发送错误响应
function send404(response){
  response.writeHead(404,{'Content-Type':'text/plain'});
  response.write('Error 4.4:文件未找到。');
  response.end();
}
//发送文件内容
function sendFile(response,filePath,fileContents){
  response.writeHead(
    200,
    {"content-Type":mime.lookup(path.basename(filePath))}
  );
  response.end(fileContents);
}
//查找文件
function serveStatic(response,cache,absPath){
  if(cache[absPath]){
    sendFile(response,absPath,cache[absPath]);
  }else{
    fs.exists(absPath,function(exists){
      if(exists){
        fs.readFile(absPath,function(err,data){
          if(err){
            send404(response);
          }else{
            cache[absPath]=data;
            sendFile(response,absPath,data);
          }
        });
      }else{
        send404(response);
      }
    });
  }
}
//入口
var server=http.createServer(function(request,response){
  var filePath=false;
  console.log(`new request for ${request.url}`);
  if(request.url==='/'){
    filePath='public/index.html';
  }else{
    filePath='public'+request.url;
  }

  var absPath='./'+filePath;
  serveStatic(response,cache,absPath);
});
server.listen(3000,function(){
  console.log("the server is listening on prot 3000.");
});
chatServer.listen(server); //websocket服务也绑定到该端口上

  3、socket服务

  socket.io提供了开箱既用的虚拟通道,所以不需要任务手动转发消息到已连接的的用户,可以使用 socket.broadcast.to(room).emit('message','hello'); room为某个聊天室id


const 
  socketio=require('socket.io');
var io,
  guestNumber=1, //用户编号
  nickNames={},  //socket id对应的nickname
  namesUsed={},  //所有已使用的nickname
  allRooms={},  //聊天室--人数
  currentRoom={}; //sockid--聊天室
module.exports.listen=function(server){
  io=socketio.listen(server);
  io.serveClient('log level',1);
  io.sockets.on('connection',function(socket){
    guestNumber=assignGuestName(socket,guestNumber,nickNames);
    joinRoom(socket,'Lobby');
    handleMessageBroadcasting(socket,nickNames);
    handleNameChangeAttempts(socket,nickNames,namesUsed);
    handleRoomJoining(socket);
    socket.on('rooms',function(){
      socket.emit('rooms',JSON.stringify(allRooms));
    });
    handleClientDisconnection(socket,nickNames,namesUsed);
  });
};
//新socket连入,自动分配一个昵称
function assignGuestName(socket,guesetNumber,nickNames){
  var name='Guest'+guestNumber;
  nickNames[socket.id]=name;
  socket.emit('nameResult',{
    success:true,
    name:name
  });
  namesUsed[name]=1;
  return guestNumber+1;
}
//加入某个聊天室
function joinRoom(socket,room){
  socket.join(room);
  var num=allRooms[room];
  if(num===undefined){
    allRooms[room]=1;
  }else{
    allRooms[room]=num+1;
  }
  currentRoom[socket.id]=room;
  socket.emit('joinResult',{room:room});
  socket.broadcast.to(room).emit('message',{
    text:nickNames[socket.id]+' has join '+room+'.'
  });
  var usersinRoom=io.sockets.adapter.rooms[room];
  if(usersinRoom.length>1){
    var usersInRoomSummary='Users currently in '+room+' : ';
    for(var index in usersinRoom.sockets){
      if(index!=socket.id){
        usersInRoomSummary+=nickNames[index]+',';
      }
    }
    socket.emit('message',{text:usersInRoomSummary}); 
  }
}
//修改昵称
function handleNameChangeAttempts(socket,nickNames,namesUsed){
  socket.on('nameAttempt',function(name){
    if(name.indexOf('Guest')==0){
      socket.emit('nameResult',{
        success:false,
        message:'Names cannot begin with "Guest".'
      });
    }else{
      if(namesUsed[name]==undefined){
        var previousName=nickNames[socket.id];
        delete namesUsed[previousName];
        namesUsed[name]=1;
        nickNames[socket.id]=name;
        socket.emit('nameResult',{
          success:true,
          name:name
        });
        socket.broadcast.to(currentRoom[socket.id]).emit('message',{
          text:previousName+' is now known as '+name+'.'
        });
      }else{
        socket.emit('nameResult',{
          success:false,
          message:'That name is already in use.' 
        });
      }
    }
  });                                    
}
//将某个用户的消息广播到同聊天室下的其他用户
function handleMessageBroadcasting(socket){
  socket.on('message',function(message){
    console.log('message:---'+JSON.stringify(message));
    socket.broadcast.to(message.room).emit('message',{
      text:nickNames[socket.id]+ ': '+message.text
    });
  });
}
//加入/创建某个聊天室
function handleRoomJoining(socket){
  socket.on('join',function(room){
    var temp=currentRoom[socket.id];
    delete currentRoom[socket.id];
    socket.leave(temp);
    var num=--allRooms[temp];
    if(num==0)
      delete allRooms[temp];
    joinRoom(socket,room.newRoom);
  });
}
//socket断线处理
function handleClientDisconnection(socket){
  socket.on('disconnect',function(){
    console.log("xxxx disconnect");
    allRooms[currentRoom[socket.id]]--;
    delete namesUsed[nickNames[socket.id]];
    delete nickNames[socket.id];
    delete currentRoom[socket.id];
  })
}

3、客户端实现socket.io

  1、chat.js处理发送消息,变更房间,聊天命令。


var Chat=function(socket){
  this.socket=socket;//绑定socket
}
//发送消息
Chat.prototype.sendMessage=function(room,text){
  var message={
    room:room,
    text:text
  };
  this.socket.emit('message',message);
};
//变更房间
Chat.prototype.changeRoom=function(room){
  this.socket.emit('join',{
    newRoom:room
  });
};
//处理聊天命令
Chat.prototype.processCommand=function(command){
  var Words=command.split(' ');
  var command=words[0].substring(1,words[0].length).toLowerCase();
  var message=false;
  switch(command){
    case 'join':
      words.shift();
      var room=words.join(' ');
      this.changeRoom(room);
      break;
    case 'nick':
      words.shift();
      var name=words.join(' ');
      this.socket.emit('nameAttempt',name);
      break;
    default:
      message='Unrecognized command.';
      break;
  }
  return message;
};

  2、chat_ui.js 处理用户输入,根据输入调用chat.js的不同方法发送消息给服务器


function divEscapedContentElement(message){
  return $('<div></div>').text(message);
}
function divSystemContentElement(message){
  return $('<div></div>').html('<i>'+message+'</i>');
}
function processUserInput(chatApp,socket){
  var message=$('#send-message').val();
  var systemMessage;
  if(message.charAt(0)=='/'){
    systemMessage=chatApp.processCommand(message);
    if(systemMessage){
      $('#messages').append(divSystemContentElement(systemMessage));
    }
  }else{
    chatApp.sendMessage($('#room').text(),message);
    $('#messages').append(divSystemContentElement(message));
    $('#messages').scrollTop($('#messages').prop('scrollHeight'));
  }
  $('#send-message').val('');
}

  3、init.js客户端程序初始化 创建一个websocket连接,绑定事件。


if(window.WebSocket){
  console.log('This browser supports WebSocket');
}else{
  console.log('This browser does not supports WebSocket');
}
var socket=io.connect();
$(document).ready(function(){
  var chatApp=new Chat(socket);
  socket.on('nameResult',function(result){
    var message;
    if(result.success){
      message='You are known as '+result.name+'.';
    }else{
      message=result.message;
    }
    console.log("nameResult:---"+message);
    $('#messages').append(divSystemContentElement(message));
    $('#nickName').text(result.name);
  });
  socket.on('joinResult',function(result){
    console.log('joinResult:---'+result);
    $('#room').text(result.room);
    $('#messages').append(divSystemContentElement('Room changed.'));
  });
  socket.on('message',function(message){
    console.log('message:---'+message);
    var newElement=$('<div></div>').text(message.text);
    $('#messages').append(newElement);
    $('#messages').scrollTop($('#messages').prop('scrollHeight'));
  });
  socket.on('rooms',function(rooms){
    console.log('rooms:---'+rooms);
    rooms=JSON.parse(rooms);
    $('#room-list').empty();
    for(var room in rooms){
      $('#room-list').append(divEscapedContentElement(room+':'+rooms[room]));
    }
    $('#room-list div').click(function(){
      chatApp.processCommand('/join '+$(this).text().split(':')[0]);
      $('#send-message').focus();
    });
  });
  setInterval(function(){
    socket.emit('rooms');
  },1000);
  $('#send-message').focus();
  $('#send-button').click(function(){
    processUserInput(chatApp,socket);
  });
});

完整代码,可到https://github.com/FleyX/ChatRoom 下载。

以上所述是小编给大家介绍的nodejs实现多房间简易聊天室功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对编程网网站的支持!

--结束END--

本文标题: Nodejs实现多房间简易聊天室功能

本文链接: https://www.lsjlt.com/news/12535.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • Nodejs实现多房间简易聊天室功能
    1、前端界面代码   前端不是重点,够用就行,下面是前端界面,具体代码可到github下载。 2、服务器端搭建   本服务器需要提供两个功能:http服务和websocket服务,由于node的事件驱动机制...
    99+
    2022-06-04
    简易 聊天室 房间
  • node+socket实现简易聊天室功能
    本文实例为大家分享了node+socket实现简易聊天室的具体代码,供大家参考,具体内容如下 服务端 const net = require('net') const serv...
    99+
    2022-11-12
  • ASP.net(C#)实现简易聊天室功能
    本文实例为大家分享了ASP.net(C#)实现简易聊天室功能的具体代码,供大家参考,具体内容如下 1.搭建框架 <html > <head>     <...
    99+
    2022-11-13
  • C#实现简易多人聊天室
    本文实例为大家分享了C#实现简易多人聊天室的具体代码,供大家参考,具体内容如下 只有一个群聊的功能 服务端 using System; using System.Collectio...
    99+
    2022-11-13
  • Java Socket实现简易聊天室
    Java-Socket编程实现简易聊天室(TCP),供大家参考,具体内容如下 实现一个服务器接收多个客户端 测试: 首先启动服务器,然后启动三个客户端,输入三个不同的用户名,分别在聊...
    99+
    2022-11-11
  • nodejs实现的一个简单聊天室功能分享
    今天我来实现一个简单的聊天室,后台用nodejs, 客户端与服务端通信用socket.io,这是一个比较成熟的websocket框架. 初始工作 1.安装express, 用这个来托管socket.io,以...
    99+
    2022-06-04
    聊天室 简单 功能
  • JAVANIO实现简单聊天室功能
    本文实例为大家分享了JAVA NIO实现简单聊天室功能的具体代码,供大家参考,具体内容如下 服务端 初始化一个ServerSocketChannel,绑定端口,然后使用Selecto...
    99+
    2022-11-12
  • java实现简易聊天功能
    本文实例为大家分享了java实现简易聊天功能的具体代码,供大家参考,具体内容如下 应用客户端和服务端通过控制台的输入输出实现简易聊天功能 思路: 1.创建服务端类ChatServer...
    99+
    2022-11-13
  • Redis实现多人多聊天室功能
    本文为大家分享了Redis支持多人多聊天室功能的设计代码,供大家参考,具体内容如下 设计原理 左边的一个数据域,代表两个聊天室,聊天室id分别是827,729 在聊天室827里,有2个人,分别是jaso...
    99+
    2022-06-04
    多人多 聊天室 功能
  • Java实现简单的聊天室功能
    本文实例为大家分享了Java实现简单聊天室功能的具体代码,供大家参考,具体内容如下 一、客户端的创建 1.我们可以用Socket来创建客户端 public class Client...
    99+
    2022-11-13
  • python实现简易聊天室(Linux终端)
    本文实例为大家分享了python实现简易聊天室的具体代码,供大家参考,具体内容如下 群聊聊天室 1.功能:类似qq群聊功能 有人进入聊天室需要输入姓名,姓名不能重复 有人进入聊天室,其他人会受到通知 xxx进入...
    99+
    2022-06-02
    python 聊天室
  • C++实现简易UDP网络聊天室
    本文实例为大家分享了C++实现简易UDP网络聊天室的具体代码,供大家参考,具体内容如下 工程名:NetSrv NetSrv.cpp //服务器端 #include<Wins...
    99+
    2022-11-12
  • 如何用python实现简易聊天室
    本篇内容主要讲解“如何用python实现简易聊天室”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“如何用python实现简易聊天室”吧!1.功能:类似qq群聊功能有人进入聊天室需要输入姓名,姓名不...
    99+
    2023-06-20
  • Java Socket怎样实现简易聊天室
    这篇文章主要介绍了Java Socket怎样实现简易聊天室,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。Java-Socket编程实现简易聊天室(TCP),具体内容如下实现一...
    99+
    2023-06-14
  • Java聊天室之实现聊天室服务端功能
    目录一、题目描述二、解题思路三、代码详解多学一个知识点一、题目描述 题目实现:实现聊天室服务器端功能。运行程序,服务端等待客户端连接,并显示客户端的连接信息。 二、解题思路 创建一个...
    99+
    2022-11-13
    Java实现聊天室 Java 聊天室 Java 服务端
  • Java聊天室之实现聊天室客户端功能
    目录一、题目描述二、解题思路三、代码详解一、题目描述 题目实现:实现聊天室客户端。运行程序,用户登录服务器后,可以从用户列表中选择单个用户进行聊天,也可以选择多个用户进行聊天。 二、...
    99+
    2022-11-13
    Java实现聊天室 Java 聊天室 Java 客户端
  • Unity实现聊天室功能
    本文实例为大家分享了Unity实现聊天室功能的具体代码,供大家参考,具体内容如下 简单聊天室功能,客户端发送消息后,服务器接收到消息后分发到其它客户端上并显示聊天内容 聊天室服务器 ...
    99+
    2022-11-11
  • java+socket实现简易局域网聊天室
    本文实例为大家分享了java+socket实现简易局域网聊天室的具体代码,供大家参考,具体内容如下 服务器端 ServerFrame.java package com.eze.cha...
    99+
    2022-11-13
  • 基于Pythonsocket实现简易网络聊天室
    目录1.socket_ui.py 服务端1-1. 依赖引用1-2. 实现过程1-3. 实现效果2.client_ui.py 客户端2-1. 依赖引用2-2. 实现过程2-3. 实现效...
    99+
    2022-11-11
  • C语言实现简易网络聊天室
    本文实例为大家分享了C语言实现网络聊天室的具体代码,供大家参考,具体内容如下 业务逻辑: 1、客户端注册名字 2、告诉所有在线的客户端,XXX进入聊天室 3、新建一个线程为该客户端服...
    99+
    2022-11-12
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作