设为首页 收藏本站
查看: 946|回复: 0

[经验分享] 基于NodeJS的秘室聊天室

[复制链接]

尚未签到

发表于 2017-2-23 06:03:54 | 显示全部楼层 |阅读模式
  借着放假期间将NodeJS重新回顾了一下并玩了一下sketch来进行设计界面,很不错。(注:代码整理后会放到github上,请关注。)
  本次聊天室我给它定义了一个名称叫“秘密聊天室”。
  需求
DSC0000.png

  技术选型
  后端:NodeJs,Socket.io,中间件(express,body-parser,multer,ejs),mongoose
  express:是NodeJs Web应用框架,主要是要理解它的router
  body-parser:用于获取req中的参数值
  multer:用于上传文件
  ejs:用于模板渲染
  mongoose:连接mongoose数据库
  数据库:mongodb
  前端:bootstrap布局,vuejs进行双向绑定,请求还是使用的jquery的ajax,未使用fetch(主要是bootstrap是基于jquery的,所以没用使用webpack或browerify等打包工具进行处理fetch)。
  实现
  1、创建web服务器
DSC0001.png

  2、进行身份认证,哪些路由要进行身份处理。
DSC0002.png

  4、数据库配置
DSC0003.png

  5、定义数据模型
DSC0004.png

  6、用户注册,登录
DSC0005.png

  7、建立socket.io
DSC0006.png

  8、前端代码就比较简单了,无否是一些请求而已,下面只截取前端socke.io部分。
DSC0007.png

  运行效果
  1、登录
DSC0008.png

  2、主界面
DSC0009.png

  3、创建房间(创建自己感兴趣的话题)
DSC00010.png

  3、模拟两个用户
DSC00011.png

  4、每个房间鼠标移入会显示房间内容
DSC00012.png

  5、加入房间,会提示谁加入
DSC00013.png

  6、退出房间,同样会有提示,房间之间互不影响。
DSC00014.png

  7、消息
DSC00015.png

  在现阶段还有未完成部分。如消息的保存,人员头像,收藏等。
  后续,希望可以将nodejs消息处理做成一个通用组件,安装消息中心后,任何系统中可以很方便调用。
  最后来一张sketch的设计稿
DSC00016.png

运维网声明 1、欢迎大家加入本站运维交流群:群②:261659950 群⑤:202807635 群⑦870801961 群⑧679858003
2、本站所有主题由该帖子作者发表,该帖子作者与运维网享有帖子相关版权
3、所有作品的著作权均归原作者享有,请您和我们一样尊重他人的著作权等合法权益。如果您对作品感到满意,请购买正版
4、禁止制作、复制、发布和传播具有反动、淫秽、色情、暴力、凶杀等内容的信息,一经发现立即删除。若您因此触犯法律,一切后果自负,我们对此不承担任何责任
5、所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其内容的准确性、可靠性、正当性、安全性、合法性等负责,亦不承担任何法律责任
6、所有作品仅供您个人学习、研究或欣赏,不得用于商业或者其他用途,否则,一切后果均由您自己承担,我们对此不承担任何法律责任
7、如涉及侵犯版权等问题,请您及时通知我们,我们将立即采取措施予以解决
8、联系人Email:admin@iyunv.com 网址:www.yunweiku.com

所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其承担任何法律责任,如涉及侵犯版权等问题,请您及时通知我们,我们将立即处理,联系人Email:kefu@iyunv.com,QQ:1061981298 本贴地址:https://www.yunweiku.com/thread-345815-1-1.html 上篇帖子: Nodejs基础:路径处理模块path总结 下篇帖子: nodejs 的 session 简单实现
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

扫码加入运维网微信交流群X

扫码加入运维网微信交流群

扫描二维码加入运维网微信交流群,最新一手资源尽在官方微信交流群!快快加入我们吧...

扫描微信二维码查看详情

客服E-mail:kefu@iyunv.com 客服QQ:1061981298


QQ群⑦:运维网交流群⑦ QQ群⑧:运维网交流群⑧ k8s群:运维网kubernetes交流群


提醒:禁止发布任何违反国家法律、法规的言论与图片等内容;本站内容均来自个人观点与网络等信息,非本站认同之观点.


本站大部分资源是网友从网上搜集分享而来,其版权均归原作者及其网站所有,我们尊重他人的合法权益,如有内容侵犯您的合法权益,请及时与我们联系进行核实删除!



合作伙伴: 青云cloud

快速回复 返回顶部 返回列表