资讯专栏INFORMATION COLUMN

用NodeJS打造多人在线聊天室(NodeJS & SocketIO & Expre

Astrian / 960人阅读

摘要:技术栈项目背景这个项目主要是为了玩玩,项目的方向大概是做出类似的在线聊天系统。项目使用进行部署和管理,功能在不断的迭代开发中。首页用户列表用户中心注册登陆注销用户资料指定聊天室开始安装使用之前,请在中修改的安装路径。

技术栈:NodeJS & SocketIO & Express & EJS & MongoDB & Gulp

项目背景

这个项目主要是为了玩玩NodeJS,项目的方向大概是做出类似QQ的在线聊天系统。想要在线体验可以点击在线演示。

项目使用PM2进行部署和管理,功能在不断的迭代开发中。如果你觉得这个项目比较有趣,或者能对你有所帮助,欢迎给个Star。

项目地址:https://github.com/bergwhite/nchat

PS: 最近找工作,北京的欢迎联系。另外之前做过一个基于Vue全家桶二次开发的V2EX社区 https://github.com/bergwhite/v2ex-vue。

项目目录

├─bin
│    www  // 启动express
├─database
│    index.js  // MongoDB
├─public  // 静态文件
│    css
│        index.css  // 首页CSS
│    js
│        index.js  // 与socket服务进行通讯(关键文件)
|        socket-server.js  // socket服务(关键文件)
│    img
├─routers
│    index.js  // 页面路由
├─view
│    error.ejs  // 错误页
│    index.ejs  // 首页
│    userCenter.ejs  // 用户中心(规划中)
│    userList.ejs  // 用户列表(规划中)
├─app.js  // express
├─package.json  // npm包

路由

目前只有/目录和/room/:id正式使用了,其他路由的页面还在迭代开发中。

/  // 首页
/user  // 用户列表
/user/:id  // 用户中心
/user/:id/register  // 注册(JSON)
/user/:id/login  // 登陆(JSON)
/user/:id/logout  // 注销(JSON)
/user/:id/info  // 用户资料(JSON)
/room/:id  // 指定聊天室

开始安装

使用之前,请在package.json中修改MongoDB的安装路径(--dbpath)。

git clone https://github.com/bergwhite/nodejs-chat  // 克隆项目到本地
cd nodejs-chat  // 进入项目目录
npm install  // 安装依赖
npm run build  // 构建线上代码
npm run mongod // 启动MongoDB服务
npm run start // 启动聊天室服务并启动网站

项目演示

目前项目存在一个已知的bug,表情包无法在div模拟的输入框中插入(修复中)。

匿名聊天

用户聊天

成员&房间

离线通知

更多房间

房间独立

已上线功能

跨浏览器,跨地域聊天(SocketIO自带技能)

首次进入会显示欢迎信息

发送空消息会进行提示

直接发送消息默认昵称为“神秘人”

发送消息后会清空当前输入框内容,然后焦点回到消息输入框

添加用户名后会成为新用户,然后告知全房间人有新用户加入

可以创建不同的房间,不同的房间的聊天是相互独立的

显示当前房间的在线用户(设置了用户名的)

显示目前所有打开的房间

用户(设置了用户名的)离线会通知所有房间内的成员

压缩线上代码,加快访问速度

...

待上线功能

用户名

统计匿名用户

支持一键随机获取用户名

头像

访客使用默认头像

新用户(设置了用户名的)随机获得一个头像

新用户换头像可以从默认的一组头像中选择

是否支持上传头像还在考虑中(安全性问题)

聊天

支持多组丰富的表情包

是否支持上传图片还在考虑中(安全性问题)

数据库

对接MongoDB,新用户(设置了用户名的)设置密码后,将从临时用户转变为正式用户

项目缺陷

界面丑(等功能完善了再考虑)

表情包无法在div模拟的输入框中插入(修复中)

...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/19024.html

相关文章

  • NodeJS打造多人在线天室NodeJS & SocketIO & Expre

    摘要:技术栈项目背景这个项目主要是为了玩玩,项目的方向大概是做出类似的在线聊天系统。项目使用进行部署和管理,功能在不断的迭代开发中。首页用户列表用户中心注册登陆注销用户资料指定聊天室开始安装使用之前,请在中修改的安装路径。 技术栈:NodeJS & SocketIO & Express & EJS & MongoDB & Gulp 项目背景 这个项目主要是为了玩玩NodeJS,项目的方向大概...

    codecook 评论0 收藏0
  • 全栈式的开发多人在线天室

    摘要:技术栈觉得好的欢迎点个。前端后端部署演示全栈式的开发多人在线聊天室项目只适配了移动端,请使用浏览器的手机视图查看。之前删除了一个文件,但是没有删除中的对应值。编译时会报上面的错误。 技术栈 觉得好的欢迎点个star ^_^。 前端:Express & EJS & ES6 & Less & Gulp 后端:Express & SocketIO & MongoDB & REST API ...

    Chiclaim 评论0 收藏0
  • 基于状态机模型的斗地主游戏(NodeJs&SocketIO

    摘要:系统结构系统考虑使用和实现服务器端逻辑,前端使用。逻辑流程主要逻辑包括用户进入游戏等待对家进入游戏游戏过程结束统计这个过程。 1. 系统结构 系统考虑使用Nodejs和SocketIo实现服务器端逻辑,前端使用HTML5。showImg(https://segmentfault.com/img/remote/1460000007643089); 2. 逻辑流程 1 . 主要逻辑包括用户...

    NoraXie 评论0 收藏0
  • 基于状态机模型的斗地主游戏(NodeJs&SocketIO

    摘要:系统结构系统考虑使用和实现服务器端逻辑,前端使用。逻辑流程主要逻辑包括用户进入游戏等待对家进入游戏游戏过程结束统计这个过程。 1. 系统结构 系统考虑使用Nodejs和SocketIo实现服务器端逻辑,前端使用HTML5。showImg(https://segmentfault.com/img/remote/1460000007643089); 2. 逻辑流程 1 . 主要逻辑包括用户...

    xcold 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<