使用socket.io + express + mongodb制作在线聊天室

Posted 2022-12-12 webchang

一、先用websocket制作简易版本的聊天室

使用Websocket制作简易聊天室

二、再用socket.io + express + mongodb制作复杂一点的在线聊天室

• 代码地址：https://github.com/ChangYanwei/chatroom
• 体验地址：http://8.131.68.141:7000
• 使用socket.io监听连接的建立、断开事件，监听用户的登录、发送消息事件
• 使用express开放静态资源目录
• 使用html2canvas实现截图
• 使用jQuery-emoji添加表情
• 除了选用默认头像外，用户可以上传本地图片作为头像
• 点击图片消息放大预览
• 用户信息保存到了MongoDB数据库中，使用mongoose在node中操作数据库
• 聊天记录没有持久化存储，刷新页面后聊天信息就没有了

注册页面

登录界面

聊天界面

修改头像

mongodb数据库中存储的用户信息

动图展示

前端学习交流QQ群：862748629 点击加入